UNPKG

vue-snotify

Version:
7 lines (6 loc) 16 kB
/** * vue-snotify v3.2.0 * (c) 2018 artemsky <mr.artemsky@gmail.com> * @license MIT */ !function(t,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("vue")):"function"==typeof define&&define.amd?define(["exports","vue"],n):n(t["vue-snotify"]={},t.Vue)}(this,function(t,n){"use strict";var e;n=n&&n.hasOwnProperty("default")?n.default:n,(e=t.SnotifyPosition||(t.SnotifyPosition={})).leftTop="leftTop",e.leftCenter="leftCenter",e.leftBottom="leftBottom",e.rightTop="rightTop",e.rightCenter="rightCenter",e.rightBottom="rightBottom",e.centerTop="centerTop",e.centerCenter="centerCenter",e.centerBottom="centerBottom";var i={simple:"simple",success:"success",error:"error",warning:"warning",info:"info",async:"async",confirm:"confirm",prompt:"prompt"};var o=function(t,n,e,i,o,s,a,r){const c=("function"==typeof e?e.options:e)||{};return c.render||(c.render=t.render,c.staticRenderFns=t.staticRenderFns,c._compiled=!0,o&&(c.functional=!0)),c._scopeId=i,c}({render:function(){var t=this,n=t.$createElement,e=t._self._c||n;return e("span",{staticClass:"snotifyToast__input",class:{"snotifyToast__input--filled":t.isPromptFocused}},[e("input",{staticClass:"snotifyToast__input__field",attrs:{type:"text",id:t.toast.id},on:{input:t.valueChanged,focus:function(n){t.isPromptFocused=!0},blur:function(n){t.isPromptFocused=!!t.toast.value.length}}}),t._v(" "),e("label",{staticClass:"snotifyToast__input__label",attrs:{for:t.toast.id}},[e("span",{staticClass:"snotifyToast__input__labelContent"},[t._v(t._s(t._f("truncate")(t.toast.config.placeholder)))])])])},staticRenderFns:[]},0,n.extend({props:["toast"],data:function(){return{isPromptFocused:!1}},methods:{valueChanged:function(t){this.toast.value=t.target.value,this.toast.eventEmitter.$emit("input")}}}),void 0,!1);var s=function(t,n,e,i,o,s,a,r){const c=("function"==typeof e?e.options:e)||{};return c.render||(c.render=t.render,c.staticRenderFns=t.staticRenderFns,c._compiled=!0,o&&(c.functional=!0)),c._scopeId=i,c}({render:function(){var t=this,n=t.$createElement,e=t._self._c||n;return e("div",{staticClass:"snotifyToast__buttons"},t._l(t.toast.config.buttons,function(n){return e("button",{class:[{"snotifyToast__buttons--bold":n.bold},n.className],attrs:{type:"button"},on:{click:function(e){e.preventDefault(),e.stopPropagation(),n.action?n.action(t.toast):t.remove()}}},[t._v("\n "+t._s(n.text)+"\n ")])}))},staticRenderFns:[]},0,n.extend({props:["toast"],methods:{remove:function(){this.$snotify.remove(this.toast.id)}}}),void 0,!1);var a=function(t,n,e,i,o,s,a,r){const c=("function"==typeof e?e.options:e)||{};return c.render||(c.render=t.render,c.staticRenderFns=t.staticRenderFns,c._compiled=!0,o&&(c.functional=!0)),c._scopeId=i,c}({render:function(){var t=this,n=t.$createElement,e=t._self._c||n;return e("div",{staticClass:"snotifyToast animated",class:["snotify-"+t.toast.config.type,t.state.animation,void 0===t.toast.valid?"":t.toast.valid?"snotifyToast--valid":"snotifyToast--invalid"],style:{"-webkit-animation-duration":t.toast.config.animation.time+"ms","animation-duration":t.toast.config.animation.time+"ms","-webkit-transition":t.toast.config.animation.time+"ms",transition:t.toast.config.animation.time+"ms"},on:{click:t.onClick,mouseenter:t.onMouseEnter,mouseleave:t.onMouseLeave,animationend:t.onExitTransitionEnd}},[t.toast.config.showProgressBar&&t.toast.config.timeout>0?e("div",{staticClass:"snotifyToast__progressBar"},[e("span",{staticClass:"snotifyToast__progressBar__percentage",style:{width:100*t.state.progress+"%"}})]):t._e(),t._v(" "),t.toast.config.html?e("div",{staticClass:"snotifyToast__inner",domProps:{innerHTML:t._s(t.toast.config.html)}}):e("div",{staticClass:"snotifyToast__inner",class:{snotifyToast__noIcon:!1===t.toast.config.icon}},[t.toast.title?e("div",{staticClass:"snotifyToast__title"},[t._v(t._s(t._f("truncate")(t.toast.title,t.toast.config.titleMaxLength)))]):t._e(),t._v(" "),t.toast.body?e("div",{staticClass:"snotifyToast__body"},[t._v(t._s(t._f("truncate")(t.toast.body,t.toast.config.bodyMaxLength)))]):t._e(),t._v(" "),t.toast.config.type===t.state.promptType?e("snotify-prompt",{attrs:{toast:t.toast}}):t._e(),t._v(" "),void 0===t.toast.config.icon?e("div",{class:["snotify-icon","snotify-icon--"+t.toast.config.type]}):!1!==t.toast.config.icon?e("div",[e("img",{staticClass:"snotify-icon",attrs:{src:t.toast.config.icon}})]):t._e()],1),t._v(" "),t.toast.config.buttons?e("snotify-button",{attrs:{toast:t.toast}}):t._e()],1)},staticRenderFns:[]},0,n.extend({props:["toastData"],components:{SnotifyPrompt:o,SnotifyButton:s},data:function(){return{toast:this.toastData,animationFrame:null,state:{paused:!1,progress:0,animation:"",isDestroying:!1,promptType:i.prompt}}},methods:{initToast:function(){this.toast.config.timeout>0&&this.startTimeout(0)},onClick:function(){this.toast.eventEmitter.$emit("click"),this.toast.config.closeOnClick&&this.$snotify.remove(this.toast.id)},onMouseEnter:function(){this.toast.eventEmitter.$emit("mouseenter"),this.toast.config.pauseOnHover&&(this.state.paused=!0)},onMouseLeave:function(){this.toast.config.pauseOnHover&&this.toast.config.timeout&&(this.state.paused=!1,this.startTimeout(this.toast.config.timeout*this.state.progress)),this.toast.eventEmitter.$emit("mouseleave")},onExitTransitionEnd:function(){this.state.isDestroying||(this.initToast(),this.toast.eventEmitter.$emit("shown"))},startTimeout:function(t){var n=this;void 0===t&&(t=0);var e=performance.now(),i=function(){n.animationFrame=requestAnimationFrame(function(o){var s=o+t-e,a=Math.min(s/n.toast.config.timeout,1);n.state.paused?cancelAnimationFrame(n.animationFrame):s<n.toast.config.timeout?(n.state.progress=a,i()):(n.state.progress=1,cancelAnimationFrame(n.animationFrame),n.$snotify.emitter.$emit("remove",n.toast.id))})};i()},onRemove:function(){var t=this;this.state.isDestroying=!0,this.$emit("stateChanged","beforeHide"),this.toast.eventEmitter.$emit("beforeHide"),this.state.animation=this.toast.config.animation.exit,setTimeout(function(){t.$emit("stateChanged","hidden"),t.state.animation="snotifyToast--out",t.toast.eventEmitter.$emit("hidden"),setTimeout(function(){return t.$snotify.remove(t.toast.id,!0)},t.toast.config.animation.time/2)},this.toast.config.animation.time/2)}},created:function(){var t=this;this.$snotify.emitter.$on("toastChanged",function(n){t.toast.id===n.id&&t.initToast()}),this.$snotify.emitter.$on("remove",function(n){t.toast.id===n&&t.onRemove()})},mounted:function(){var t=this;this.$nextTick(function(){t.toast.eventEmitter.$emit("mounted"),t.state.animation="snotifyToast--in",t.$nextTick(function(){setTimeout(function(){t.$emit("stateChanged","beforeShow"),t.toast.eventEmitter.$emit("beforeShow"),t.state.animation=t.toast.config.animation.enter},t.toast.config.animation.time/5)})})},destroyed:function(){cancelAnimationFrame(this.animationFrame),this.toast.eventEmitter.$emit("destroyed")}}),void 0,!1);var r=function(t,n,e,i,o,s,a,r){const c=("function"==typeof e?e.options:e)||{};return c.render||(c.render=t.render,c.staticRenderFns=t.staticRenderFns,c._compiled=!0,o&&(c.functional=!0)),c._scopeId=i,c}({render:function(){var t=this,n=t.$createElement,e=t._self._c||n;return e("div",[t.backdrop>=0?e("div",{staticClass:"snotify-backdrop",style:{opacity:t.backdrop}}):t._e(),t._v(" "),t._l(t.notifications,function(n,i){return e("div",{staticClass:"snotify",class:"snotify-"+i},t._l(t.notifications[i].slice(t.blockSize_a,t.blockSize_b),function(n){return e("toast",{key:n.id,attrs:{toastData:n},on:{stateChanged:t.stateChanged}})}))})],2)},staticRenderFns:[]},0,n.extend({components:{Toast:a},data:function(){return{notifications:{left_top:[],left_center:[],left_bottom:[],right_top:[],right_center:[],right_bottom:[],center_top:[],center_center:[],center_bottom:[]},dockSize_a:0,dockSize_b:0,blockSize_a:0,blockSize_b:0,backdrop:-1,withBackdrop:[]}},methods:{setOptions:function(t){this.$snotify.config.global.newOnTop?(this.dockSize_a=-this.$snotify.config.global.maxOnScreen,this.dockSize_b=void 0,this.blockSize_a=-this.$snotify.config.global.maxAtPosition,this.blockSize_b=void 0,this.withBackdrop=t.filter(function(t){return t.config.backdrop>=0})):(this.dockSize_a=0,this.dockSize_b=this.$snotify.config.global.maxOnScreen,this.blockSize_a=0,this.blockSize_b=this.$snotify.config.global.maxAtPosition,this.withBackdrop=t.filter(function(t){return t.config.backdrop>=0}).reverse()),this.notifications=this.splitToasts(t.slice(this.dockSize_a,this.dockSize_b)),this.stateChanged("mounted")},stateChanged:function(t){if(this.withBackdrop.length)switch(t){case"mounted":this.backdrop<0&&(this.backdrop=0);break;case"beforeShow":this.backdrop=this.withBackdrop[this.withBackdrop.length-1].config.backdrop;break;case"beforeHide":1===this.withBackdrop.length&&(this.backdrop=0);break;case"hidden":1===this.withBackdrop.length&&(this.backdrop=-1)}},splitToasts:function(n){var e={};for(var i in t.SnotifyPosition)t.SnotifyPosition.hasOwnProperty(i)&&(e[t.SnotifyPosition[i]]=[]);return n.forEach(function(t){e[t.config.position].push(t)}),e}},created:function(){var t=this;this.$snotify.emitter.$on("snotify",function(n){t.setOptions(n)})}}),void 0,!1),c=Object.assign||function(t){for(var n,e=1,i=arguments.length;e<i;e++)for(var o in n=arguments[e])Object.prototype.hasOwnProperty.call(n,o)&&(t[o]=n[o]);return t};function f(t,n,e,i){var o,s=arguments.length,a=s<3?n:null===i?i=Object.getOwnPropertyDescriptor(n,e):i;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(t,n,e,i);else for(var r=t.length-1;r>=0;r--)(o=t[r])&&(a=(s<3?o(a):s>3?o(n,e,a):o(n,e))||a);return s>3&&a&&Object.defineProperty(n,e,a),a}function u(t,n){if("object"==typeof Reflect&&"function"==typeof Reflect.metadata)return Reflect.metadata(t,n)}var l,p=function(){function t(t,e,o,s){var a=this;this.id=t,this.title=e,this.body=o,this.config=s,this.eventEmitter=new n,this._eventsHolder=[],this.valid=void 0,this.config.type===i.prompt&&(this.value=""),this.on("hidden",function(){a._eventsHolder.forEach(function(t){a.eventEmitter.$off(t.event,t.action)})})}return t.prototype.on=function(t,n){var e=this;return this._eventsHolder.push({event:t,action:n}),this.eventEmitter.$on(t,function(){return n(e)}),this},t}(),d={global:{newOnTop:!0,maxOnScreen:8,maxAtPosition:8,oneAtTime:!1,preventDuplicates:!1},toast:{type:i.simple,showProgressBar:!0,timeout:2e3,closeOnClick:!0,pauseOnHover:!0,bodyMaxLength:150,titleMaxLength:16,backdrop:-1,icon:void 0,html:null,position:t.SnotifyPosition.rightBottom,animation:{enter:"fadeIn",exit:"fadeOut",time:400}},type:(l={},l[i.prompt]={timeout:0,closeOnClick:!1,buttons:[{text:"Ok",action:null,bold:!0},{text:"Cancel",action:null,bold:!1}],placeholder:"Enter answer here...",type:i.prompt},l[i.confirm]={timeout:0,closeOnClick:!1,buttons:[{text:"Ok",action:null,bold:!0},{text:"Cancel",action:null,bold:!1}],type:i.confirm},l[i.simple]={type:i.simple},l[i.success]={type:i.success},l[i.error]={type:i.error},l[i.warning]={type:i.warning},l[i.info]={type:i.info},l[i.async]={pauseOnHover:!1,closeOnClick:!1,timeout:0,showProgressBar:!1,type:i.async},l)};function h(t,n,e){return n===i.async?{value:function(){for(var t,n=[],i=0;i<arguments.length;i++)n[i]=arguments[i];return t=2===n.length?{title:null,body:n[0],config:null,action:n[1]}:3===n.length?"string"==typeof n[1]?{title:n[1],body:n[0],config:null,action:n[2]}:{title:null,body:n[0],config:n[2],action:n[1]}:{title:n[1],body:n[0],config:n[3],action:n[2]},e.value.apply(this,[t])}}:{value:function(){for(var t,n,i=[],o=0;o<arguments.length;o++)i[o]=arguments[o];return 1===i.length?t={title:null,body:i[0],config:null}:3===i.length?t={title:i[1],body:i[0],config:i[2]}:((n={title:null,config:null,body:i[0]})["string"==typeof i[1]?"title":"config"]=i[1],t=n),e.value.apply(this,[t])}}}function m(t){return t&&"object"==typeof t&&!Array.isArray(t)&&null!==t}function y(){for(var t=[],n=0;n<arguments.length;n++)t[n]=arguments[n];var e,i={};if(!t.length)return i;for(;t.length>0;){var o=t.shift();if(m(o))for(var s in o)m(o[s])?i[s]=y(i[s],o[s]):Object.assign(i,((e={})[s]=o[s],e))}return i}function g(t,n,e){return{value:function(){for(var t=[],i=0;i<arguments.length;i++)t[i]=arguments[i];return t[0].config=c({},t[0].config,{type:n}),e.value.apply(this,t)}}}var v=function(){function t(){this.emitter=new n,this.notifications=[],this.config=d}return t.prototype.emit=function(){this.emitter.$emit("snotify",this.notifications.slice())},t.prototype.get=function(t){return this.notifications.find(function(n){return n.id===t})},t.prototype.add=function(t){this.config.global.newOnTop?this.notifications.unshift(t):this.notifications.push(t),this.emit()},t.prototype.remove=function(t,n){return t?n?(this.notifications=this.notifications.filter(function(n){return n.id!==t}),this.emit()):void this.emitter.$emit("remove",t):this.clear()},t.prototype.clear=function(){this.notifications=[],this.emit()},t.prototype.button=function(t,n,e,i){var o=this;return void 0===n&&(n=!0),void 0===e&&(e=null),void 0===i&&(i=!1),{text:t,action:n?function(t){e(t),o.remove(t.id)}:e,bold:i}},t.prototype.create=function(t){if(!(this.config.global.oneAtTime&&0!==this.notifications.length||this.config.global.preventDuplicates&&1===this.notifications.filter(function(n){return n.config.type===t.config.type}).length)){var n=y(this.config.toast,this.config.type[t.config.type],t.config),e=new p(n.id?n.id:Math.floor(Math.random()*(Date.now()-1))+1,t.title,t.body,n);return this.add(e),e}},t.prototype.setDefaults=function(t){return this.config=y(this.config,t)},t.prototype.simple=function(t){return this.create(t)},t.prototype.success=function(t){return this.create(t)},t.prototype.error=function(t){return this.create(t)},t.prototype.info=function(t){return this.create(t)},t.prototype.warning=function(t){return this.create(t)},t.prototype.confirm=function(t){return this.create(t)},t.prototype.prompt=function(t){return this.create(t)},t.prototype.async=function(t){var n=this,e=t.action,o=this.create(t);return o.on("mounted",function(){e().then(function(t){return n.mergeToast(o,t,i.success)}).catch(function(t){return n.mergeToast(o,t,i.error)})}),o},t.prototype.mergeToast=function(t,n,e){n.body&&(t.body=n.body),n.title&&(t.title=n.title),t.config=e?y(t.config,this.config.global,this.config.toast[e],{type:e},n.config):y(t.config,n.config),n.html&&(t.config.html=n.html),this.emit(),this.emitter.$emit("toastChanged",t)},t.prototype.html=function(t,n){return this.create({title:null,body:null,config:c({},n,{html:t})})},f([h,g,u("design:type",Function),u("design:paramtypes",[Object]),u("design:returntype",p)],t.prototype,"simple",null),f([h,g,u("design:type",Function),u("design:paramtypes",[Object]),u("design:returntype",p)],t.prototype,"success",null),f([h,g,u("design:type",Function),u("design:paramtypes",[Object]),u("design:returntype",p)],t.prototype,"error",null),f([h,g,u("design:type",Function),u("design:paramtypes",[Object]),u("design:returntype",p)],t.prototype,"info",null),f([h,g,u("design:type",Function),u("design:paramtypes",[Object]),u("design:returntype",p)],t.prototype,"warning",null),f([h,g,u("design:type",Function),u("design:paramtypes",[Object]),u("design:returntype",p)],t.prototype,"confirm",null),f([h,g,u("design:type",Function),u("design:paramtypes",[Object]),u("design:returntype",p)],t.prototype,"prompt",null),f([h,g,u("design:type",Function),u("design:paramtypes",[Object]),u("design:returntype",p)],t.prototype,"async",null),t}(),b={install:function(t,n){void 0===n&&(n={}),t.filter("truncate",function(t,n,e){return void 0===n&&(n=40),void 0===e&&(e="..."),t.length>n?t.substring(0,n)+e:t});var e=new v;e.setDefaults(n),t.prototype.$snotify=e,t.component("vue-snotify",r),"undefined"!=typeof window&&window.hasOwnProperty("Vue")&&(window.Snotify=e)}};"undefined"!=typeof window&&window.hasOwnProperty("Vue")&&window.Vue.use(b.install),t.default=b,t.SnotifyStyle=i,t.SnotifyToast=p,Object.defineProperty(t,"__esModule",{value:!0})});