Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
vue-loading-overlay
Advanced tools
vue-loading-overlay - npm Package Compare versions
Comparing version 3.0.1 to 3.1.0
@@ -5,5 +5,7 @@ # Changelog | ||
| ### [3.1.0](https://github.com/ankurk91/vue-loading-overlay/compare/3.0.1...3.1.0) | ||
| * Add: `bars` loader type | ||
| ### [3.0.1](https://github.com/ankurk91/vue-loading-overlay/compare/3.0.0...3.0.1) | ||
| * Add: | ||
| - `opacity` prop | ||
| * Add: `opacity` prop | ||
@@ -10,0 +12,0 @@ ### [3.0.0](https://github.com/ankurk91/vue-loading-overlay/compare/2.2.2...3.0.0) (breaking) |
@@ -110,3 +110,3 @@ (function webpackUniversalModuleDefinition(root, factory) { | ||
| // CONCATENATED MODULE: ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options!./src/js/Component.vue?vue&type=template&id=b5f714b4& | ||
| // CONCATENATED MODULE: ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options!./src/js/Component.vue?vue&type=template&id=d0930dae& | ||
| var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('transition',{attrs:{"name":_vm.transition}},[_c('div',{directives:[{name:"show",rawName:"v-show",value:(_vm.isActive),expression:"isActive"}],staticClass:"vld-overlay is-active",class:{'is-full-page': _vm.isFullPage },attrs:{"tabindex":"0","aria-busy":_vm.isActive,"aria-label":"Loading"}},[_c('div',{staticClass:"vld-background",style:({background: this.backgroundColor, opacity: this.opacity}),on:{"click":function($event){$event.preventDefault();return _vm.cancel($event)}}}),_vm._v(" "),_c('div',{staticClass:"vld-icon"},[_vm._t("before"),_vm._v(" "),_vm._t("default",[_c(_vm.loader,{tag:"component",attrs:{"color":_vm.color,"width":_vm.width,"height":_vm.height}})]),_vm._v(" "),_vm._t("after")],2)])])} | ||
@@ -116,5 +116,5 @@ var staticRenderFns = [] | ||
| // CONCATENATED MODULE: ./src/js/Component.vue?vue&type=template&id=b5f714b4& | ||
| // CONCATENATED MODULE: ./src/js/Component.vue?vue&type=template&id=d0930dae& | ||
| // CONCATENATED MODULE: ./src/js/util.js | ||
| // CONCATENATED MODULE: ./src/js/helpers.js | ||
| var removeElement = function removeElement(el) { | ||
@@ -175,8 +175,8 @@ if (typeof el.remove !== 'undefined') { | ||
| }); | ||
| // CONCATENATED MODULE: ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options!./src/loaders/spinner.vue?vue&type=template&id=b62d5ff4& | ||
| var spinnervue_type_template_id_b62d5ff4_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('svg',{attrs:{"width":_vm.width,"height":_vm.height,"viewBox":"0 0 38 38","xmlns":"http://www.w3.org/2000/svg","stroke":_vm.color}},[_c('g',{attrs:{"fill":"none","fill-rule":"evenodd"}},[_c('g',{attrs:{"transform":"translate(1 1)","stroke-width":"2"}},[_c('circle',{attrs:{"stroke-opacity":".25","cx":"18","cy":"18","r":"18"}}),_vm._v(" "),_c('path',{attrs:{"d":"M36 18c0-9.94-8.06-18-18-18"}},[_c('animateTransform',{attrs:{"attributeName":"transform","type":"rotate","from":"0 18 18","to":"360 18 18","dur":"0.8s","repeatCount":"indefinite"}})],1)])])])} | ||
| var spinnervue_type_template_id_b62d5ff4_staticRenderFns = [] | ||
| // CONCATENATED MODULE: ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options!./src/loaders/spinner.vue?vue&type=template&id=490457ac& | ||
| var spinnervue_type_template_id_490457ac_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('svg',{attrs:{"viewBox":"0 0 38 38","xmlns":"http://www.w3.org/2000/svg","width":_vm.width,"height":_vm.height,"stroke":_vm.color}},[_c('g',{attrs:{"fill":"none","fill-rule":"evenodd"}},[_c('g',{attrs:{"transform":"translate(1 1)","stroke-width":"2"}},[_c('circle',{attrs:{"stroke-opacity":".25","cx":"18","cy":"18","r":"18"}}),_vm._v(" "),_c('path',{attrs:{"d":"M36 18c0-9.94-8.06-18-18-18"}},[_c('animateTransform',{attrs:{"attributeName":"transform","type":"rotate","from":"0 18 18","to":"360 18 18","dur":"0.8s","repeatCount":"indefinite"}})],1)])])])} | ||
| var spinnervue_type_template_id_490457ac_staticRenderFns = [] | ||
| // CONCATENATED MODULE: ./src/loaders/spinner.vue?vue&type=template&id=b62d5ff4& | ||
| // CONCATENATED MODULE: ./src/loaders/spinner.vue?vue&type=template&id=490457ac& | ||
@@ -204,3 +204,2 @@ // CONCATENATED MODULE: ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options!./src/loaders/spinner.vue?vue&type=script&lang=js& | ||
| /* harmony default export */ var spinnervue_type_script_lang_js_ = ({ | ||
@@ -330,4 +329,4 @@ name: 'spinner', | ||
| loaders_spinnervue_type_script_lang_js_, | ||
| spinnervue_type_template_id_b62d5ff4_render, | ||
| spinnervue_type_template_id_b62d5ff4_staticRenderFns, | ||
| spinnervue_type_template_id_490457ac_render, | ||
| spinnervue_type_template_id_490457ac_staticRenderFns, | ||
| false, | ||
@@ -342,8 +341,8 @@ null, | ||
| /* harmony default export */ var spinner = (component.exports); | ||
| // CONCATENATED MODULE: ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options!./src/loaders/dots.vue?vue&type=template&id=ec913efc& | ||
| var dotsvue_type_template_id_ec913efc_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('svg',{attrs:{"width":_vm.width,"height":_vm.height,"viewBox":"0 0 120 30","xmlns":"http://www.w3.org/2000/svg","fill":_vm.color}},[_c('circle',{attrs:{"cx":"15","cy":"15","r":"15"}},[_c('animate',{attrs:{"attributeName":"r","from":"15","to":"15","begin":"0s","dur":"0.8s","values":"15;9;15","calcMode":"linear","repeatCount":"indefinite"}}),_vm._v(" "),_c('animate',{attrs:{"attributeName":"fill-opacity","from":"1","to":"1","begin":"0s","dur":"0.8s","values":"1;.5;1","calcMode":"linear","repeatCount":"indefinite"}})]),_vm._v(" "),_c('circle',{attrs:{"cx":"60","cy":"15","r":"9","fill-opacity":"0.3"}},[_c('animate',{attrs:{"attributeName":"r","from":"9","to":"9","begin":"0s","dur":"0.8s","values":"9;15;9","calcMode":"linear","repeatCount":"indefinite"}}),_vm._v(" "),_c('animate',{attrs:{"attributeName":"fill-opacity","from":"0.5","to":"0.5","begin":"0s","dur":"0.8s","values":".5;1;.5","calcMode":"linear","repeatCount":"indefinite"}})]),_vm._v(" "),_c('circle',{attrs:{"cx":"105","cy":"15","r":"15"}},[_c('animate',{attrs:{"attributeName":"r","from":"15","to":"15","begin":"0s","dur":"0.8s","values":"15;9;15","calcMode":"linear","repeatCount":"indefinite"}}),_vm._v(" "),_c('animate',{attrs:{"attributeName":"fill-opacity","from":"1","to":"1","begin":"0s","dur":"0.8s","values":"1;.5;1","calcMode":"linear","repeatCount":"indefinite"}})])])} | ||
| var dotsvue_type_template_id_ec913efc_staticRenderFns = [] | ||
| // CONCATENATED MODULE: ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options!./src/loaders/dots.vue?vue&type=template&id=59466ef5& | ||
| var dotsvue_type_template_id_59466ef5_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('svg',{attrs:{"viewBox":"0 0 120 30","xmlns":"http://www.w3.org/2000/svg","fill":_vm.color,"width":_vm.width,"height":_vm.height}},[_c('circle',{attrs:{"cx":"15","cy":"15","r":"15"}},[_c('animate',{attrs:{"attributeName":"r","from":"15","to":"15","begin":"0s","dur":"0.8s","values":"15;9;15","calcMode":"linear","repeatCount":"indefinite"}}),_vm._v(" "),_c('animate',{attrs:{"attributeName":"fill-opacity","from":"1","to":"1","begin":"0s","dur":"0.8s","values":"1;.5;1","calcMode":"linear","repeatCount":"indefinite"}})]),_vm._v(" "),_c('circle',{attrs:{"cx":"60","cy":"15","r":"9","fill-opacity":"0.3"}},[_c('animate',{attrs:{"attributeName":"r","from":"9","to":"9","begin":"0s","dur":"0.8s","values":"9;15;9","calcMode":"linear","repeatCount":"indefinite"}}),_vm._v(" "),_c('animate',{attrs:{"attributeName":"fill-opacity","from":"0.5","to":"0.5","begin":"0s","dur":"0.8s","values":".5;1;.5","calcMode":"linear","repeatCount":"indefinite"}})]),_vm._v(" "),_c('circle',{attrs:{"cx":"105","cy":"15","r":"15"}},[_c('animate',{attrs:{"attributeName":"r","from":"15","to":"15","begin":"0s","dur":"0.8s","values":"15;9;15","calcMode":"linear","repeatCount":"indefinite"}}),_vm._v(" "),_c('animate',{attrs:{"attributeName":"fill-opacity","from":"1","to":"1","begin":"0s","dur":"0.8s","values":"1;.5;1","calcMode":"linear","repeatCount":"indefinite"}})])])} | ||
| var dotsvue_type_template_id_59466ef5_staticRenderFns = [] | ||
| // CONCATENATED MODULE: ./src/loaders/dots.vue?vue&type=template&id=ec913efc& | ||
| // CONCATENATED MODULE: ./src/loaders/dots.vue?vue&type=template&id=59466ef5& | ||
@@ -389,3 +388,3 @@ // CONCATENATED MODULE: ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options!./src/loaders/dots.vue?vue&type=script&lang=js& | ||
| /* harmony default export */ var dotsvue_type_script_lang_js_ = ({ | ||
| name: 'spinner', | ||
| name: 'dots', | ||
| props: { | ||
@@ -418,4 +417,4 @@ color: { | ||
| loaders_dotsvue_type_script_lang_js_, | ||
| dotsvue_type_template_id_ec913efc_render, | ||
| dotsvue_type_template_id_ec913efc_staticRenderFns, | ||
| dotsvue_type_template_id_59466ef5_render, | ||
| dotsvue_type_template_id_59466ef5_staticRenderFns, | ||
| false, | ||
@@ -430,2 +429,80 @@ null, | ||
| /* harmony default export */ var dots = (dots_component.exports); | ||
| // CONCATENATED MODULE: ./node_modules/vue-loader/lib/loaders/templateLoader.js??vue-loader-options!./node_modules/vue-loader/lib??vue-loader-options!./src/loaders/bars.vue?vue&type=template&id=48a4e7fe& | ||
| var barsvue_type_template_id_48a4e7fe_render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('svg',{attrs:{"xmlns":"http://www.w3.org/2000/svg","viewBox":"0 0 30 30","height":_vm.height,"width":_vm.width,"fill":_vm.color}},[_c('rect',{attrs:{"x":"0","y":"13","width":"4","height":"5"}},[_c('animate',{attrs:{"attributeName":"height","attributeType":"XML","values":"5;21;5","begin":"0s","dur":"0.6s","repeatCount":"indefinite"}}),_vm._v(" "),_c('animate',{attrs:{"attributeName":"y","attributeType":"XML","values":"13; 5; 13","begin":"0s","dur":"0.6s","repeatCount":"indefinite"}})]),_vm._v(" "),_c('rect',{attrs:{"x":"10","y":"13","width":"4","height":"5"}},[_c('animate',{attrs:{"attributeName":"height","attributeType":"XML","values":"5;21;5","begin":"0.15s","dur":"0.6s","repeatCount":"indefinite"}}),_vm._v(" "),_c('animate',{attrs:{"attributeName":"y","attributeType":"XML","values":"13; 5; 13","begin":"0.15s","dur":"0.6s","repeatCount":"indefinite"}})]),_vm._v(" "),_c('rect',{attrs:{"x":"20","y":"13","width":"4","height":"5"}},[_c('animate',{attrs:{"attributeName":"height","attributeType":"XML","values":"5;21;5","begin":"0.3s","dur":"0.6s","repeatCount":"indefinite"}}),_vm._v(" "),_c('animate',{attrs:{"attributeName":"y","attributeType":"XML","values":"13; 5; 13","begin":"0.3s","dur":"0.6s","repeatCount":"indefinite"}})])])} | ||
| var barsvue_type_template_id_48a4e7fe_staticRenderFns = [] | ||
| // CONCATENATED MODULE: ./src/loaders/bars.vue?vue&type=template&id=48a4e7fe& | ||
| // CONCATENATED MODULE: ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options!./src/loaders/bars.vue?vue&type=script&lang=js& | ||
| // | ||
| // | ||
| // | ||
| // | ||
| // | ||
| // | ||
| // | ||
| // | ||
| // | ||
| // | ||
| // | ||
| // | ||
| // | ||
| // | ||
| // | ||
| // | ||
| // | ||
| // | ||
| // | ||
| // | ||
| // | ||
| // | ||
| // | ||
| // | ||
| // | ||
| // | ||
| // | ||
| // | ||
| // | ||
| /* harmony default export */ var barsvue_type_script_lang_js_ = ({ | ||
| name: 'bars', | ||
| props: { | ||
| color: { | ||
| type: String, | ||
| default: '#000' | ||
| }, | ||
| height: { | ||
| type: Number, | ||
| default: 40 | ||
| }, | ||
| width: { | ||
| type: Number, | ||
| default: 40 | ||
| } | ||
| } | ||
| }); | ||
| // CONCATENATED MODULE: ./src/loaders/bars.vue?vue&type=script&lang=js& | ||
| /* harmony default export */ var loaders_barsvue_type_script_lang_js_ = (barsvue_type_script_lang_js_); | ||
| // CONCATENATED MODULE: ./src/loaders/bars.vue | ||
| /* normalize component */ | ||
| var bars_component = normalizeComponent( | ||
| loaders_barsvue_type_script_lang_js_, | ||
| barsvue_type_template_id_48a4e7fe_render, | ||
| barsvue_type_template_id_48a4e7fe_staticRenderFns, | ||
| false, | ||
| null, | ||
| null, | ||
| null | ||
| ) | ||
| bars_component.options.__file = "bars.vue" | ||
| /* harmony default export */ var bars = (bars_component.exports); | ||
| // CONCATENATED MODULE: ./src/loaders/index.js | ||
@@ -435,5 +512,7 @@ | ||
| /* harmony default export */ var loaders = ({ | ||
| Spinner: spinner, | ||
| Dots: dots | ||
| Dots: dots, | ||
| Bars: bars | ||
| }); | ||
@@ -491,4 +570,3 @@ // CONCATENATED MODULE: ./node_modules/babel-loader/lib!./node_modules/vue-loader/lib??vue-loader-options!./src/js/Component.vue?vue&type=script&lang=js& | ||
| onCancel: { | ||
| type: Function, | ||
| default: function _default() {} | ||
| type: Function | ||
| }, | ||
@@ -508,3 +586,3 @@ color: String, | ||
| // Don't mutate the prop | ||
| isActive: this.active || false | ||
| isActive: this.active | ||
| }; | ||
@@ -609,3 +687,3 @@ }, | ||
| var api_LoadingApi = function LoadingApi(Vue) { | ||
| var api_Api = function Api(Vue) { | ||
| var globalProps = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {}; | ||
@@ -639,3 +717,3 @@ var globalSlots = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : {}; | ||
| /* harmony default export */ var js_api = (api_LoadingApi); | ||
| /* harmony default export */ var js_api = (api_Api); | ||
| // EXTERNAL MODULE: ./src/css/index.css | ||
@@ -642,0 +720,0 @@ var css = __webpack_require__(0); |
@@ -1,1 +0,1 @@ | ||
| !function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define("VueLoading",[],e):"object"==typeof exports?exports.VueLoading=e():t.VueLoading=e()}("undefined"!=typeof self?self:this,function(){return function(t){var e={};function n(i){if(e[i])return e[i].exports;var o=e[i]={i:i,l:!1,exports:{}};return t[i].call(o.exports,o,o.exports,n),o.l=!0,o.exports}return n.m=t,n.c=e,n.d=function(t,e,i){n.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:i})},n.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},n.t=function(t,e){if(1&e&&(t=n(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var i=Object.create(null);if(n.r(i),Object.defineProperty(i,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var o in t)n.d(i,o,function(e){return t[e]}.bind(null,o));return i},n.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return n.d(e,"a",e),e},n.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},n.p="",n(n.s=1)}([function(t,e,n){},function(t,e,n){"use strict";n.r(e);var i="undefined"!=typeof window?window.HTMLElement:Object,o={mounted:function(){document.addEventListener("focusin",this.focusIn)},methods:{focusIn:function(t){if(this.isActive&&t.target!==this.$el&&!this.$el.contains(t.target)){var e=this.container?this.container:this.isFullPage?null:this.$el.parentElement;(this.isFullPage||e&&e.contains(t.target))&&(t.preventDefault(),this.$el.focus())}}},beforeDestroy:function(){document.removeEventListener("focusin",this.focusIn)}};function r(t,e,n,i,o,r,a,s){var l,c="function"==typeof t?t.options:t;if(e&&(c.render=e,c.staticRenderFns=n,c._compiled=!0),i&&(c.functional=!0),r&&(c._scopeId="data-v-"+r),a?(l=function(t){(t=t||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(t=__VUE_SSR_CONTEXT__),o&&o.call(this,t),t&&t._registeredComponents&&t._registeredComponents.add(a)},c._ssrRegister=l):o&&(l=s?function(){o.call(this,this.$root.$options.shadowRoot)}:o),l)if(c.functional){c._injectStyles=l;var u=c.render;c.render=function(t,e){return l.call(e),u(t,e)}}else{var d=c.beforeCreate;c.beforeCreate=d?[].concat(d,l):[l]}return{exports:t,options:c}}var a=r({name:"spinner",props:{color:{type:String,default:"#000"},height:{type:Number,default:64},width:{type:Number,default:64}}},function(){var t=this.$createElement,e=this._self._c||t;return e("svg",{attrs:{width:this.width,height:this.height,viewBox:"0 0 38 38",xmlns:"http://www.w3.org/2000/svg",stroke:this.color}},[e("g",{attrs:{fill:"none","fill-rule":"evenodd"}},[e("g",{attrs:{transform:"translate(1 1)","stroke-width":"2"}},[e("circle",{attrs:{"stroke-opacity":".25",cx:"18",cy:"18",r:"18"}}),this._v(" "),e("path",{attrs:{d:"M36 18c0-9.94-8.06-18-18-18"}},[e("animateTransform",{attrs:{attributeName:"transform",type:"rotate",from:"0 18 18",to:"360 18 18",dur:"0.8s",repeatCount:"indefinite"}})],1)])])])},[],!1,null,null,null);a.options.__file="spinner.vue";var s=a.exports,l=r({name:"spinner",props:{color:{type:String,default:"#000"},height:{type:Number,default:240},width:{type:Number,default:60}}},function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("svg",{attrs:{width:t.width,height:t.height,viewBox:"0 0 120 30",xmlns:"http://www.w3.org/2000/svg",fill:t.color}},[n("circle",{attrs:{cx:"15",cy:"15",r:"15"}},[n("animate",{attrs:{attributeName:"r",from:"15",to:"15",begin:"0s",dur:"0.8s",values:"15;9;15",calcMode:"linear",repeatCount:"indefinite"}}),t._v(" "),n("animate",{attrs:{attributeName:"fill-opacity",from:"1",to:"1",begin:"0s",dur:"0.8s",values:"1;.5;1",calcMode:"linear",repeatCount:"indefinite"}})]),t._v(" "),n("circle",{attrs:{cx:"60",cy:"15",r:"9","fill-opacity":"0.3"}},[n("animate",{attrs:{attributeName:"r",from:"9",to:"9",begin:"0s",dur:"0.8s",values:"9;15;9",calcMode:"linear",repeatCount:"indefinite"}}),t._v(" "),n("animate",{attrs:{attributeName:"fill-opacity",from:"0.5",to:"0.5",begin:"0s",dur:"0.8s",values:".5;1;.5",calcMode:"linear",repeatCount:"indefinite"}})]),t._v(" "),n("circle",{attrs:{cx:"105",cy:"15",r:"15"}},[n("animate",{attrs:{attributeName:"r",from:"15",to:"15",begin:"0s",dur:"0.8s",values:"15;9;15",calcMode:"linear",repeatCount:"indefinite"}}),t._v(" "),n("animate",{attrs:{attributeName:"fill-opacity",from:"1",to:"1",begin:"0s",dur:"0.8s",values:"1;.5;1",calcMode:"linear",repeatCount:"indefinite"}})])])},[],!1,null,null,null);l.options.__file="dots.vue";var c=l.exports,u=r({name:"vue-loading",mixins:[o],props:{active:Boolean,programmatic:Boolean,container:[Object,Function,i],isFullPage:{type:Boolean,default:!0},transition:{type:String,default:"fade"},canCancel:Boolean,onCancel:{type:Function,default:function(){}},color:String,backgroundColor:String,opacity:Number,width:Number,height:Number,loader:{type:String,default:"spinner"}},data:function(){return{isActive:this.active||!1}},components:{Spinner:s,Dots:c},beforeMount:function(){this.programmatic&&(this.container?(this.isFullPage=!1,this.container.appendChild(this.$el)):document.body.appendChild(this.$el))},mounted:function(){this.programmatic&&(this.isActive=!0),document.addEventListener("keyup",this.keyPress)},methods:{cancel:function(){this.canCancel&&this.isActive&&(this.hide(),this.onCancel.apply(null,arguments))},hide:function(){var t=this;this.$emit("hide"),this.$emit("update:active",!1),this.programmatic&&(this.isActive=!1,setTimeout(function(){var e;t.$destroy(),void 0!==(e=t.$el).remove?e.remove():e.parentNode.removeChild(e)},150))},keyPress:function(t){27===t.keyCode&&this.cancel()}},watch:{active:function(t){this.isActive=t}},beforeDestroy:function(){document.removeEventListener("keyup",this.keyPress)}},function(){var t=this,e=t.$createElement,n=t._self._c||e;return n("transition",{attrs:{name:t.transition}},[n("div",{directives:[{name:"show",rawName:"v-show",value:t.isActive,expression:"isActive"}],staticClass:"vld-overlay is-active",class:{"is-full-page":t.isFullPage},attrs:{tabindex:"0","aria-busy":t.isActive,"aria-label":"Loading"}},[n("div",{staticClass:"vld-background",style:{background:this.backgroundColor,opacity:this.opacity},on:{click:function(e){return e.preventDefault(),t.cancel(e)}}}),t._v(" "),n("div",{staticClass:"vld-icon"},[t._t("before"),t._v(" "),t._t("default",[n(t.loader,{tag:"component",attrs:{color:t.color,width:t.width,height:t.height}})]),t._v(" "),t._t("after")],2)])])},[],!1,null,null,null);u.options.__file="Component.vue";var d=u.exports;n(0),d.install=function(t){var e=function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},n=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};return{show:function(){var i=arguments.length>0&&void 0!==arguments[0]?arguments[0]:e,o=arguments.length>1&&void 0!==arguments[1]?arguments[1]:n,r=Object.assign({},e,i,{programmatic:!0}),a=new(t.extend(d))({el:document.createElement("div"),propsData:r}),s=Object.assign({},n,o);return Object.keys(s).map(function(t){a.$slots[t]=s[t]}),a}}}(t,arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},arguments.length>2&&void 0!==arguments[2]?arguments[2]:{});t.$loading=e,t.prototype.$loading=e},e.default=d}]).default}); | ||
| !function(t,e){"object"==typeof exports&&"object"==typeof module?module.exports=e():"function"==typeof define&&define.amd?define("VueLoading",[],e):"object"==typeof exports?exports.VueLoading=e():t.VueLoading=e()}("undefined"!=typeof self?self:this,function(){return function(t){var e={};function i(n){if(e[n])return e[n].exports;var r=e[n]={i:n,l:!1,exports:{}};return t[n].call(r.exports,r,r.exports,i),r.l=!0,r.exports}return i.m=t,i.c=e,i.d=function(t,e,n){i.o(t,e)||Object.defineProperty(t,e,{enumerable:!0,get:n})},i.r=function(t){"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(t,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(t,"__esModule",{value:!0})},i.t=function(t,e){if(1&e&&(t=i(t)),8&e)return t;if(4&e&&"object"==typeof t&&t&&t.__esModule)return t;var n=Object.create(null);if(i.r(n),Object.defineProperty(n,"default",{enumerable:!0,value:t}),2&e&&"string"!=typeof t)for(var r in t)i.d(n,r,function(e){return t[e]}.bind(null,r));return n},i.n=function(t){var e=t&&t.__esModule?function(){return t.default}:function(){return t};return i.d(e,"a",e),e},i.o=function(t,e){return Object.prototype.hasOwnProperty.call(t,e)},i.p="",i(i.s=1)}([function(t,e,i){},function(t,e,i){"use strict";i.r(e);var n="undefined"!=typeof window?window.HTMLElement:Object,r={mounted:function(){document.addEventListener("focusin",this.focusIn)},methods:{focusIn:function(t){if(this.isActive&&t.target!==this.$el&&!this.$el.contains(t.target)){var e=this.container?this.container:this.isFullPage?null:this.$el.parentElement;(this.isFullPage||e&&e.contains(t.target))&&(t.preventDefault(),this.$el.focus())}}},beforeDestroy:function(){document.removeEventListener("focusin",this.focusIn)}};function a(t,e,i,n,r,a,o,s){var u,l="function"==typeof t?t.options:t;if(e&&(l.render=e,l.staticRenderFns=i,l._compiled=!0),n&&(l.functional=!0),a&&(l._scopeId="data-v-"+a),o?(u=function(t){(t=t||this.$vnode&&this.$vnode.ssrContext||this.parent&&this.parent.$vnode&&this.parent.$vnode.ssrContext)||"undefined"==typeof __VUE_SSR_CONTEXT__||(t=__VUE_SSR_CONTEXT__),r&&r.call(this,t),t&&t._registeredComponents&&t._registeredComponents.add(o)},l._ssrRegister=u):r&&(u=s?function(){r.call(this,this.$root.$options.shadowRoot)}:r),u)if(l.functional){l._injectStyles=u;var c=l.render;l.render=function(t,e){return u.call(e),c(t,e)}}else{var d=l.beforeCreate;l.beforeCreate=d?[].concat(d,u):[u]}return{exports:t,options:l}}var o=a({name:"spinner",props:{color:{type:String,default:"#000"},height:{type:Number,default:64},width:{type:Number,default:64}}},function(){var t=this.$createElement,e=this._self._c||t;return e("svg",{attrs:{viewBox:"0 0 38 38",xmlns:"http://www.w3.org/2000/svg",width:this.width,height:this.height,stroke:this.color}},[e("g",{attrs:{fill:"none","fill-rule":"evenodd"}},[e("g",{attrs:{transform:"translate(1 1)","stroke-width":"2"}},[e("circle",{attrs:{"stroke-opacity":".25",cx:"18",cy:"18",r:"18"}}),this._v(" "),e("path",{attrs:{d:"M36 18c0-9.94-8.06-18-18-18"}},[e("animateTransform",{attrs:{attributeName:"transform",type:"rotate",from:"0 18 18",to:"360 18 18",dur:"0.8s",repeatCount:"indefinite"}})],1)])])])},[],!1,null,null,null);o.options.__file="spinner.vue";var s=o.exports,u=a({name:"dots",props:{color:{type:String,default:"#000"},height:{type:Number,default:240},width:{type:Number,default:60}}},function(){var t=this,e=t.$createElement,i=t._self._c||e;return i("svg",{attrs:{viewBox:"0 0 120 30",xmlns:"http://www.w3.org/2000/svg",fill:t.color,width:t.width,height:t.height}},[i("circle",{attrs:{cx:"15",cy:"15",r:"15"}},[i("animate",{attrs:{attributeName:"r",from:"15",to:"15",begin:"0s",dur:"0.8s",values:"15;9;15",calcMode:"linear",repeatCount:"indefinite"}}),t._v(" "),i("animate",{attrs:{attributeName:"fill-opacity",from:"1",to:"1",begin:"0s",dur:"0.8s",values:"1;.5;1",calcMode:"linear",repeatCount:"indefinite"}})]),t._v(" "),i("circle",{attrs:{cx:"60",cy:"15",r:"9","fill-opacity":"0.3"}},[i("animate",{attrs:{attributeName:"r",from:"9",to:"9",begin:"0s",dur:"0.8s",values:"9;15;9",calcMode:"linear",repeatCount:"indefinite"}}),t._v(" "),i("animate",{attrs:{attributeName:"fill-opacity",from:"0.5",to:"0.5",begin:"0s",dur:"0.8s",values:".5;1;.5",calcMode:"linear",repeatCount:"indefinite"}})]),t._v(" "),i("circle",{attrs:{cx:"105",cy:"15",r:"15"}},[i("animate",{attrs:{attributeName:"r",from:"15",to:"15",begin:"0s",dur:"0.8s",values:"15;9;15",calcMode:"linear",repeatCount:"indefinite"}}),t._v(" "),i("animate",{attrs:{attributeName:"fill-opacity",from:"1",to:"1",begin:"0s",dur:"0.8s",values:"1;.5;1",calcMode:"linear",repeatCount:"indefinite"}})])])},[],!1,null,null,null);u.options.__file="dots.vue";var l=u.exports,c=a({name:"bars",props:{color:{type:String,default:"#000"},height:{type:Number,default:40},width:{type:Number,default:40}}},function(){var t=this,e=t.$createElement,i=t._self._c||e;return i("svg",{attrs:{xmlns:"http://www.w3.org/2000/svg",viewBox:"0 0 30 30",height:t.height,width:t.width,fill:t.color}},[i("rect",{attrs:{x:"0",y:"13",width:"4",height:"5"}},[i("animate",{attrs:{attributeName:"height",attributeType:"XML",values:"5;21;5",begin:"0s",dur:"0.6s",repeatCount:"indefinite"}}),t._v(" "),i("animate",{attrs:{attributeName:"y",attributeType:"XML",values:"13; 5; 13",begin:"0s",dur:"0.6s",repeatCount:"indefinite"}})]),t._v(" "),i("rect",{attrs:{x:"10",y:"13",width:"4",height:"5"}},[i("animate",{attrs:{attributeName:"height",attributeType:"XML",values:"5;21;5",begin:"0.15s",dur:"0.6s",repeatCount:"indefinite"}}),t._v(" "),i("animate",{attrs:{attributeName:"y",attributeType:"XML",values:"13; 5; 13",begin:"0.15s",dur:"0.6s",repeatCount:"indefinite"}})]),t._v(" "),i("rect",{attrs:{x:"20",y:"13",width:"4",height:"5"}},[i("animate",{attrs:{attributeName:"height",attributeType:"XML",values:"5;21;5",begin:"0.3s",dur:"0.6s",repeatCount:"indefinite"}}),t._v(" "),i("animate",{attrs:{attributeName:"y",attributeType:"XML",values:"13; 5; 13",begin:"0.3s",dur:"0.6s",repeatCount:"indefinite"}})])])},[],!1,null,null,null);c.options.__file="bars.vue";var d=c.exports,f=a({name:"vue-loading",mixins:[r],props:{active:Boolean,programmatic:Boolean,container:[Object,Function,n],isFullPage:{type:Boolean,default:!0},transition:{type:String,default:"fade"},canCancel:Boolean,onCancel:{type:Function},color:String,backgroundColor:String,opacity:Number,width:Number,height:Number,loader:{type:String,default:"spinner"}},data:function(){return{isActive:this.active}},components:{Spinner:s,Dots:l,Bars:d},beforeMount:function(){this.programmatic&&(this.container?(this.isFullPage=!1,this.container.appendChild(this.$el)):document.body.appendChild(this.$el))},mounted:function(){this.programmatic&&(this.isActive=!0),document.addEventListener("keyup",this.keyPress)},methods:{cancel:function(){this.canCancel&&this.isActive&&(this.hide(),this.onCancel.apply(null,arguments))},hide:function(){var t=this;this.$emit("hide"),this.$emit("update:active",!1),this.programmatic&&(this.isActive=!1,setTimeout(function(){var e;t.$destroy(),void 0!==(e=t.$el).remove?e.remove():e.parentNode.removeChild(e)},150))},keyPress:function(t){27===t.keyCode&&this.cancel()}},watch:{active:function(t){this.isActive=t}},beforeDestroy:function(){document.removeEventListener("keyup",this.keyPress)}},function(){var t=this,e=t.$createElement,i=t._self._c||e;return i("transition",{attrs:{name:t.transition}},[i("div",{directives:[{name:"show",rawName:"v-show",value:t.isActive,expression:"isActive"}],staticClass:"vld-overlay is-active",class:{"is-full-page":t.isFullPage},attrs:{tabindex:"0","aria-busy":t.isActive,"aria-label":"Loading"}},[i("div",{staticClass:"vld-background",style:{background:this.backgroundColor,opacity:this.opacity},on:{click:function(e){return e.preventDefault(),t.cancel(e)}}}),t._v(" "),i("div",{staticClass:"vld-icon"},[t._t("before"),t._v(" "),t._t("default",[i(t.loader,{tag:"component",attrs:{color:t.color,width:t.width,height:t.height}})]),t._v(" "),t._t("after")],2)])])},[],!1,null,null,null);f.options.__file="Component.vue";var p=f.exports;i(0),p.install=function(t){var e=function(t){var e=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},i=arguments.length>2&&void 0!==arguments[2]?arguments[2]:{};return{show:function(){var n=arguments.length>0&&void 0!==arguments[0]?arguments[0]:e,r=arguments.length>1&&void 0!==arguments[1]?arguments[1]:i,a=Object.assign({},e,n,{programmatic:!0}),o=new(t.extend(p))({el:document.createElement("div"),propsData:a}),s=Object.assign({},i,r);return Object.keys(s).map(function(t){o.$slots[t]=s[t]}),o}}}(t,arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},arguments.length>2&&void 0!==arguments[2]?arguments[2]:{});t.$loading=e,t.prototype.$loading=e},e.default=p}]).default}); |
| { | ||
| "name": "vue-loading-overlay", | ||
| "version": "3.0.1", | ||
| "version": "3.1.0", | ||
| "description": "Vue.js component for full screen loading indicator", | ||
@@ -48,3 +48,3 @@ "main": "dist/vue-loading.js", | ||
| "cross-env": "^5.2.0", | ||
| "css-loader": "^1.0.0", | ||
| "css-loader": "^1.0.1", | ||
| "file-loader": "^2.0.0", | ||
@@ -57,6 +57,6 @@ "html-webpack-plugin": "^3.2.0", | ||
| "vue": "^2.5.17", | ||
| "vue-jest": "^2.6.0", | ||
| "vue-jest": "^3.0.0", | ||
| "vue-loader": "^15.4.2", | ||
| "vue-template-compiler": "^2.5.17", | ||
| "webpack": "^4.20.2", | ||
| "webpack": "^4.23.1", | ||
| "webpack-cli": "^3.1.2", | ||
@@ -63,0 +63,0 @@ "webpack-serve": "^2.0.2" |
@@ -126,8 +126,8 @@ # Vue Loading Overlay Component | ||
| | on-cancel | Function | `()=>{}` | Do something upon cancel, works in conjunction with `can-cancel` | | ||
| | is-full-page | Boolean | `true` | When `false`; limit loader to its container^ | | ||
| | transition | String | `fade` | [Transition](https://vuejs.org/v2/guide/transitions.html) name | | ||
| | is-full-page | Boolean | `true` | When `false`; limit loader to its container^ | | ||
| | color | String | `#000` | Customize the color of loading icon | | ||
| | height | Number | * | Customize the height of loading icon | | ||
| | width | Number | * | Customize the width of loading icon | | ||
| | loader | String | `spinner` | Name of icon shape you want use as loader, `spinner` or `dots` | | ||
| | loader | String | `spinner` | Name of icon shape you want use as loader, `spinner` or `dots` or `bars` | | ||
| | background-color | String | `#fff` | Customize the overlay background color | | ||
@@ -138,3 +138,3 @@ | opacity | Number | `0.5` | Customize the overlay background opacity | | ||
| You can use CSS helper class `vld-parent`. | ||
| * *The default `height` and `width` values may be different based on the `loader` prop | ||
| * *The default `height` and `width` values may be vary based on the `loader` prop value | ||
@@ -152,3 +152,3 @@ ## Available slots | ||
| let loader = Vue.$loading.show({ | ||
| // Pass props (camelCased property names) | ||
| // Pass props by their camelCased names | ||
| container: this.$refs.loadingContainer, | ||
@@ -165,3 +165,3 @@ canCancel: true, // default false | ||
| // Pass slots by their names | ||
| default: this.$createElement('your-custom-loader-component-element'), | ||
| default: this.$createElement('your-custom-loader-component-name'), | ||
| }); | ||
@@ -168,0 +168,0 @@ // hide loader whenever you want |
| import Component from './Component.vue' | ||
| const LoadingApi = (Vue, globalProps = {}, globalSlots = {}) => { | ||
| const Api = (Vue, globalProps = {}, globalSlots = {}) => { | ||
| return { | ||
@@ -26,2 +26,2 @@ show(props = globalProps, slots = globalSlots) { | ||
| export default LoadingApi; | ||
| export default Api; |
| import Spinner from './spinner.vue' | ||
| import Dots from './dots.vue' | ||
| import Bars from './bars.vue' | ||
| export default { | ||
| Spinner, | ||
| Dots | ||
| Dots, | ||
| Bars, | ||
| } |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
New alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Fixed alerts
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
Improved metrics
- Total package byte prevSize
- increased by11.3%
56606
- Number of package files
- increased by6.25%
17
- Lines of code
- increased by10.1%
796
No dependency changes