vue3-ui-preloader/dist/loader.umd.min.js

Vue3 preloader component made with CSS transistions and animations, easy to use, integrate and customize.

(function(t,e){"object"===typeof exports&&"object"===typeof module?module.exports=e(require("vue")):"function"===typeof define&&define.amd?define([],e):"object"===typeof exports?exports["loader"]=e(require("vue")):t["loader"]=e(t["Vue"])})("undefined"!==typeof self?self:this,(function(t){return function(){"use strict";var e={82:function(t,e){e.Z=(t,e)=>{const o=t.__vccOpts||t;for(const[r,i]of e)o[r]=i;return o}},203:function(e){e.exports=t}},o={};function r(t){var i=o[t];if(void 0!==i)return i.exports;var n=o[t]={exports:{}};return e[t](n,n.exports,r),n.exports}!function(){r.d=function(t,e){for(var o in e)r.o(e,o)&&!r.o(t,o)&&Object.defineProperty(t,o,{enumerable:!0,get:e[o]})}}(),function(){r.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)}}(),function(){r.p=""}();var i={};return function(){if(r.d(i,{default:function(){return A}}),"undefined"!==typeof window){var t=window.document.currentScript,e=t&&t.src.match(/(.+\/)[^/]+\.js(\?.*)?$/);e&&(r.p=e[1])}var o=r(203);function n(t,e,r,i,n,l){return(0,o.openBlock)(),(0,o.createElementBlock)("div",null,[((0,o.openBlock)(),(0,o.createBlock)((0,o.resolveDynamicComponent)(r.name),{object:r.object,color1:r.color1,color2:r.color2,loadingText:r.loadingText,textColor:r.textColor,textSize:r.textSize,textWeight:r.textWeight,size:r.size,speed:r.speed,bg:r.bg,objectbg:r.objectbg,opacity:r.opacity,disableScrolling:r.disableScrolling},null,8,["object","color1","color2","loadingText","textColor","textSize","textWeight","size","speed","bg","objectbg","opacity","disableScrolling"]))])}const l={class:"load-text"};function s(t,e,r,i,n,s){return(0,o.openBlock)(),(0,o.createElementBlock)("div",{id:"overlay-spinner",style:(0,o.normalizeStyle)({"background-color":n.bgcolors})},[(0,o.createElementVNode)("span",l,(0,o.toDisplayString)(r.loadingText),1),(0,o.createElementVNode)("div",{class:"loader-spinner",style:(0,o.normalizeStyle)({border:r.size+"px solid "+r.objectbg,"border-top":r.size+"px solid "+r.object})},null,4)],4)}var a={mounted(){this.disableScrolling&&document.body.classList.add("overflowHidden")},unmounted(){this.disableScrolling&&document.body.classList.remove("overflowHidden")}},c={name:"static-loader",mixins:[a],props:{object:{type:String},color1:{type:String},color2:{type:String},loadingText:{type:String},textColor:{type:String},textSize:{type:[String,Number]},textWeight:{type:[String,Number]},size:{type:[String,Number]},speed:{type:[String,Number]},opacity:{type:[String,Number]},bg:{type:String},objectbg:{type:String},disableScrolling:{type:Boolean}},data(){return{bgcolors:""}},created(){let t=document.documentElement;if(t.style.setProperty("--time-animation","spin "+this.speed+"s linear infinite"),t.style.setProperty("--load-text-color",this.textColor),t.style.setProperty("--load-text-size",this.textSize+"px"),t.style.setProperty("--load-text-weight",this.textWeight),/^#([A-Fa-f0-9]{3}){1,2}$/.test(this.bg)){let t=this.bg.substring(1).split("");3==t.length&&(t=[t[0],t[0],t[1],t[1],t[2],t[2]]),t="0x"+t.join(""),this.bgcolors="rgba("+[t>>16&255,t>>8&255,255&t].join(",")+","+this.opacity/100+")"}}},p=r(82);const g=(0,p.Z)(c,[["render",s]]);var d=g;function y(t,e,r,i,n,l){return(0,o.openBlock)(),(0,o.createElementBlock)("div",{id:"overlay-dots",style:(0,o.normalizeStyle)({"background-color":n.bgcolors})},[(0,o.createElementVNode)("div",{class:"loader-dots",style:(0,o.normalizeStyle)({color:r.object,"font-size":r.size+"px"})},null,4)],4)}var b={name:"dots",mixins:[a],props:{object:{type:String},color1:{type:String},color2:{type:String},loadingText:{type:String},textColor:{type:String},textSize:{type:[String,Number]},textWeight:{type:[String,Number]},size:{type:[String,Number]},speed:{type:[String,Number]},opacity:{type:[String,Number]},bg:{type:String},objectbg:{type:String},disableScrolling:{type:Boolean}},data(){return{bgcolors:""}},created(){let t=document.documentElement;if(t.style.setProperty("--time-animation","load7 "+this.speed+"s infinite ease-in-out"),/^#([A-Fa-f0-9]{3}){1,2}$/.test(this.bg)){let t=this.bg.substring(1).split("");3==t.length&&(t=[t[0],t[0],t[1],t[1],t[2],t[2]]),t="0x"+t.join(""),this.bgcolors="rgba("+[t>>16&255,t>>8&255,255&t].join(",")+","+this.opacity/100+")"}}};const u=(0,p.Z)(b,[["render",y]]);var m=u;const S=(0,o.createElementVNode)("div",{class:"loader-circular"},null,-1),f=[S];function x(t,e,r,i,n,l){return(0,o.openBlock)(),(0,o.createElementBlock)("div",{id:"overlay-circular",style:(0,o.normalizeStyle)({"background-color":n.bgcolors})},f,4)}var h={name:"circular",mixins:[a],props:{object:{type:String},color1:{type:String},color2:{type:String},loadingText:{type:String},textColor:{type:String},textSize:{type:[String,Number]},textWeight:{type:[String,Number]},size:{type:[String,Number]},speed:{type:[String,Number]},opacity:{type:[String,Number]},bg:{type:String},objectbg:{type:String},disableScrolling:{type:Boolean}},data(){return{bgcolors:""}},created(){let t=document.documentElement;if(t.style.setProperty("--color-animation1",this.object),t.style.setProperty("--color-animation2",this.color1),t.style.setProperty("--color-animation3",this.color2),t.style.setProperty("--border-size",this.size+"px solid transparent"),t.style.setProperty("--time-animation1","spin-circular "+(this.speed-.5)+"s linear infinite"),t.style.setProperty("--time-animation2","spin-circular "+this.speed+"s linear infinite"),t.style.setProperty("--time-animation3","spin-circular "+(this.speed+1)+"s linear infinite"),/^#([A-Fa-f0-9]{3}){1,2}$/.test(this.bg)){let t=this.bg.substring(1).split("");3==t.length&&(t=[t[0],t[0],t[1],t[1],t[2],t[2]]),t="0x"+t.join(""),this.bgcolors="rgba("+[t>>16&255,t>>8&255,255&t].join(",")+","+this.opacity/100+")"}}};const v=(0,p.Z)(h,[["render",x]]);var j=v;const z={class:"load-text"};function N(t,e,r,i,n,l){return(0,o.openBlock)(),(0,o.createElementBlock)("div",{id:"overlay-bar",style:(0,o.normalizeStyle)({"background-color":n.bgcolors})},[(0,o.createElementVNode)("div",{class:"loader-bar",style:(0,o.normalizeStyle)({color:r.object,"font-size":r.size+"px"})},[(0,o.createElementVNode)("span",z,(0,o.toDisplayString)(r.loadingText),1)],4)],4)}var k={name:"toptombar",mixins:[a],props:{object:{type:String},color1:{type:String},color2:{type:String},loadingText:{type:String},textColor:{type:String},textSize:{type:[String,Number]},textWeight:{type:[String,Number]},size:{type:[String,Number]},speed:{type:[String,Number]},opacity:{type:[String,Number]},bg:{type:String},objectbg:{type:String},disableScrolling:{type:Boolean}},data(){return{bgcolors:""}},created(){let t=document.documentElement;if(t.style.setProperty("--time-animation","load "+this.speed+"s infinite alternate ease-in-out"),t.style.setProperty("--color-bar",this.objectbg),t.style.setProperty("--load-text-color",this.textColor),t.style.setProperty("--load-text-size",this.textSize+"px"),t.style.setProperty("--load-text-weight",this.textWeight),/^#([A-Fa-f0-9]{3}){1,2}$/.test(this.bg)){let t=this.bg.substring(1).split("");3==t.length&&(t=[t[0],t[0],t[1],t[1],t[2],t[2]]),t="0x"+t.join(""),this.bgcolors="rgba("+[t>>16&255,t>>8&255,255&t].join(",")+","+this.opacity/100+")"}}};const B=(0,p.Z)(k,[["render",N]]);var P=B;function E(t,e,r,i,n,l){return(0,o.openBlock)(),(0,o.createElementBlock)("div",{id:"overlay-box",style:(0,o.normalizeStyle)({"background-color":n.bgcolors})},[(0,o.createElementVNode)("div",{class:"load-box",style:(0,o.normalizeStyle)({background:r.object,width:20*r.size+"px",height:20*r.size+"px"})},null,4)],4)}var C={name:"box",mixins:[a],props:{object:{type:String},color1:{type:String},color2:{type:String},loadingText:{type:String},textColor:{type:String},textSize:{type:[String,Number]},textWeight:{type:[String,Number]},size:{type:[String,Number]},speed:{type:[String,Number]},opacity:{type:[String,Number]},bg:{type:String},objectbg:{type:String},disableScrolling:{type:Boolean}},data(){return{bgcolors:""}},created(){let t=document.documentElement;if(t.style.setProperty("--time-animation","loading "+this.speed+"s linear infinite"),/^#([A-Fa-f0-9]{3}){1,2}$/.test(this.bg)){let t=this.bg.substring(1).split("");3==t.length&&(t=[t[0],t[0],t[1],t[1],t[2],t[2]]),t="0x"+t.join(""),this.bgcolors="rgba("+[t>>16&255,t>>8&255,255&t].join(",")+","+this.opacity/100+")"}}};const T=(0,p.Z)(C,[["render",E]]);var W=T,w={name:"loader",components:{spinning:d,dots:m,circular:j,loading:P,box:W},props:{object:{type:String,default:"#ff9633"},color1:{type:String,default:"#ffffff"},color2:{type:String,default:"#17fd3d"},loadingText:{type:String,default:"LOADING..."},textColor:{type:String,default:"#ffffff"},textSize:{type:[String,Number],default:15},textWeight:{type:[String,Number],default:800},size:{type:[String,Number],default:5},speed:{type:[String,Number],default:2},opacity:{type:[String,Number],default:80},bg:{type:String,default:"#343a40"},objectbg:{type:String,default:"#999793"},name:{type:String,default:"spinning"},disableScrolling:{type:Boolean,default:!1}}};const V=(0,p.Z)(w,[["render",n]]);var Z=V,A=Z}(),i=i["default"],i}()}));
//# sourceMappingURL=loader.umd.min.js.map