UNPKG

balm-ui

Version:

A modular and customizable UI library based on Material Design and Vue 3

1 lines 3.07 kB
!function(e,t){"object"===typeof exports&&"object"===typeof module?module.exports=t(require("vue")):"function"===typeof define&&define.amd?define("$toast",["vue"],t):"object"===typeof exports?exports.$toast=t(require("vue")):e.$toast=t(e.Vue)}("undefined"!==typeof self?self:this,(function(e){return function(){"use strict";var t={154:function(t){t.exports=e}},o={};function n(e){var s=o[e];if(void 0!==s)return s.exports;var i=o[e]={exports:{}};return t[e](i,i.exports,n),i.exports}n.d=function(e,t){for(var o in t)n.o(t,o)&&!n.o(e,o)&&Object.defineProperty(e,o,{enumerable:!0,get:t[o]})},n.o=function(e,t){return Object.prototype.hasOwnProperty.call(e,t)},n.r=function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})};var s={};n.r(s),n.d(s,{default:function(){return O},install:function(){return y},useToast:function(){return T}});var i=n(154);var r="undefined"===typeof window?i.createSSRApp:i.createApp;const u=/(?:^\[object\s(.*?)\]$)/;var c=e=>Object.prototype.toString.call(e).replace(u,"$1").toLowerCase();function a(e){return document.getElementById(e)||function(e){const t=document.createElement("div");return t.id=e,document.body.appendChild(t),t}(e)}const p={id:"balmui-toast",timeoutMs:{MIN:2e3,MAX:3500,DEFAULTS:2750},position:{TOP:"top",BOTTOM:"bottom",CENTER:"center"}},d={className:"",timeoutMs:p.timeoutMs.DEFAULTS,message:"",position:p.position.BOTTOM};let m,l,f,b=d;const v='<div :class="className">\n <div class="mdc-snackbar__surface">\n <div class="mdc-snackbar__label" v-text="message"></div>\n </div>\n</div>';function g(e){return a(p.id),r({name:"Toast",expose:["render"],setup(){const t=(0,i.reactive)({open:!1,opening:!0,opened:!1,options:e}),o=(0,i.computed)((()=>["top","center"].includes(t.options.position)?`mdc-toast--${t.options.position}`:"")),n=(0,i.computed)((()=>["mdc-snackbar","mdc-toast",o.value,t.options.className,{"mdc-snackbar--opening":t.opening,"mdc-snackbar--open":t.opened}])),s=(0,i.computed)((()=>t.options.message));function r(){t.open=!0,l=setTimeout((()=>{t.open=!1}),t.options.timeoutMs)}function u(e){if(!(e.timeoutMs<=p.timeoutMs.MAX&&e.timeoutMs>=p.timeoutMs.MIN))throw new Error(`[$toast]: The timeoutMs of the toast must be between ${p.timeoutMs.MIN} and ${p.timeoutMs.MAX}`);t.options=e,r()}return(0,i.watch)((()=>t.open),(e=>{e?setTimeout((()=>{t.opened=!0,setTimeout((()=>{t.opening=!1}),150)}),150):(t.opening=!0,t.opened=!1)})),(0,i.onMounted)((()=>u(e))),{className:n,message:s,render:u}},template:v})}function M(){const e=function(e,t){let o=Object.assign({},e);return"string"===c(t)?o.message=`${t}`:"object"===c(t)&&(o=Object.assign({},o,t)),o}(b,arguments.length>0&&void 0!==arguments[0]?arguments[0]:{});m?(clearTimeout(l),clearTimeout(f),m.render(e)):m=g(e).mount(`#${p.id}`)}function y(e){let t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{};b=Object.assign({},d,t),e.config.globalProperties.$toast=M,e.provide("toast",M)}const T=()=>M;var O={install:y};return s}()}));