diff --git a/dist/vue-ladda.js b/dist/vue-ladda.js index c083ac8..8198231 100644 --- a/dist/vue-ladda.js +++ b/dist/vue-ladda.js @@ -1,8 +1,8 @@ -!function(n,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.VueLadda=t():n.VueLadda=t()}(this,function(){return function(n){function t(e){if(a[e])return a[e].exports;var o=a[e]={i:e,l:!1,exports:{}};return n[e].call(o.exports,o,o.exports,t),o.l=!0,o.exports}var a={};return t.m=n,t.c=a,t.i=function(n){return n},t.d=function(n,a,e){t.o(n,a)||Object.defineProperty(n,a,{configurable:!1,enumerable:!0,get:e})},t.n=function(n){var a=n&&n.__esModule?function(){return n.default}:function(){return n};return t.d(a,"a",a),a},t.o=function(n,t){return Object.prototype.hasOwnProperty.call(n,t)},t.p="",t(t.s=2)}([function(n,t,a){a(9);var e=a(7)(a(1),a(8),null,null);e.options.__file="/Users/zcfan/Dev/vue-ladda/src/vue-ladda.vue",e.esModule&&Object.keys(e.esModule).some(function(n){return"default"!==n&&"__esModule"!==n})&&console.error("named exports are not supported in *.vue files."),e.options.functional&&console.error("[vue-loader] vue-ladda.vue: functional components are not supported with templates, they should use render functions."),n.exports=e.exports},function(n,t,a){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var e=a(5),o=function(n){return n&&n.__esModule?n:{default:n}}(e);t.default={name:"VueLadda",props:{dataStyle:{type:String,default:"expand-left"},loading:{type:Boolean,required:!0},progress:{validator:function(n){return n>=0&&n<=1},default:0}},watch:{loading:function(n){n?this.ladda.start():this.ladda.stop()},progress:function(n){this.ladda.setProgress(n)}},methods:{handleClick:function(n){this.$emit("click",n)}},mounted:function(){this.ladda=o.default.create(this.$refs.ladda),this.loading?this.ladda.start():this.ladda.stop()},beforeDestroy:function(){this.ladda.remove(),delete this.ladda}}},function(n,t,a){"use strict";Object.defineProperty(t,"__esModule",{value:!0});var e=a(0),o=function(n){return n&&n.__esModule?n:{default:n}}(e),d={install:function(n,t){n.component("vue-ladda",o.default)}};"undefined"!=typeof window&&window.Vue&&window.Vue.use(d),t.default=o.default},function(n,t,a){t=n.exports=a(4)(void 0),t.push([n.i,'/*!\n * Ladda including the default theme.\n */\n/*!\n * Ladda\n * http://lab.hakim.se/ladda\n * MIT licensed\n *\n * Copyright (C) 2016 Hakim El Hattab, http://hakim.se\n */\n/*************************************\n * CONFIG\n */\n/*************************************\n * MIXINS\n */\n/*************************************\n * BUTTON BASE\n */\n.ladda-button {\n position: relative;\n}\n\n/* Spinner animation */\n.ladda-button .ladda-spinner {\n position: absolute;\n z-index: 2;\n display: inline-block;\n width: 32px;\n height: 32px;\n top: 50%;\n margin-top: 0;\n opacity: 0;\n pointer-events: none;\n}\n\n/* Button label */\n.ladda-button .ladda-label {\n position: relative;\n z-index: 3;\n}\n\n/* Progress bar */\n.ladda-button .ladda-progress {\n position: absolute;\n width: 0;\n height: 100%;\n left: 0;\n top: 0;\n background: rgba(0, 0, 0, 0.2);\n visibility: hidden;\n opacity: 0;\n -webkit-transition: 0.1s linear all !important;\n -moz-transition: 0.1s linear all !important;\n -ms-transition: 0.1s linear all !important;\n -o-transition: 0.1s linear all !important;\n transition: 0.1s linear all !important;\n}\n.ladda-button[data-loading] .ladda-progress {\n opacity: 1;\n visibility: visible;\n}\n\n/*************************************\n * EASING\n */\n.ladda-button,\n.ladda-button .ladda-spinner,\n.ladda-button .ladda-label {\n -webkit-transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important;\n -moz-transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important;\n -ms-transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important;\n -o-transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important;\n transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) all !important;\n}\n.ladda-button[data-style=zoom-in],\n.ladda-button[data-style=zoom-in] .ladda-spinner,\n.ladda-button[data-style=zoom-in] .ladda-label,\n.ladda-button[data-style=zoom-out],\n.ladda-button[data-style=zoom-out] .ladda-spinner,\n.ladda-button[data-style=zoom-out] .ladda-label {\n -webkit-transition: 0.3s ease all !important;\n -moz-transition: 0.3s ease all !important;\n -ms-transition: 0.3s ease all !important;\n -o-transition: 0.3s ease all !important;\n transition: 0.3s ease all !important;\n}\n\n/*************************************\n * EXPAND LEFT\n */\n.ladda-button[data-style=expand-right] .ladda-spinner {\n right: -6px;\n}\n.ladda-button[data-style=expand-right][data-size="s"] .ladda-spinner,\n.ladda-button[data-style=expand-right][data-size="xs"] .ladda-spinner {\n right: -12px;\n}\n.ladda-button[data-style=expand-right][data-loading] {\n padding-right: 56px;\n}\n.ladda-button[data-style=expand-right][data-loading] .ladda-spinner {\n opacity: 1;\n}\n.ladda-button[data-style=expand-right][data-loading][data-size="s"], .ladda-button[data-style=expand-right][data-loading][data-size="xs"] {\n padding-right: 40px;\n}\n\n/*************************************\n * EXPAND RIGHT\n */\n.ladda-button[data-style=expand-left] .ladda-spinner {\n left: 26px;\n}\n.ladda-button[data-style=expand-left][data-size="s"] .ladda-spinner,\n.ladda-button[data-style=expand-left][data-size="xs"] .ladda-spinner {\n left: 4px;\n}\n.ladda-button[data-style=expand-left][data-loading] {\n padding-left: 56px;\n}\n.ladda-button[data-style=expand-left][data-loading] .ladda-spinner {\n opacity: 1;\n}\n.ladda-button[data-style=expand-left][data-loading][data-size="s"], .ladda-button[data-style=expand-left][data-loading][data-size="xs"] {\n padding-left: 40px;\n}\n\n/*************************************\n * EXPAND UP\n */\n.ladda-button[data-style=expand-up] {\n overflow: hidden;\n}\n.ladda-button[data-style=expand-up] .ladda-spinner {\n top: -32px;\n left: 50%;\n margin-left: 0;\n}\n.ladda-button[data-style=expand-up][data-loading] {\n padding-top: 54px;\n}\n.ladda-button[data-style=expand-up][data-loading] .ladda-spinner {\n opacity: 1;\n top: 26px;\n margin-top: 0;\n}\n.ladda-button[data-style=expand-up][data-loading][data-size="s"], .ladda-button[data-style=expand-up][data-loading][data-size="xs"] {\n padding-top: 32px;\n}\n.ladda-button[data-style=expand-up][data-loading][data-size="s"] .ladda-spinner, .ladda-button[data-style=expand-up][data-loading][data-size="xs"] .ladda-spinner {\n top: 4px;\n}\n\n/*************************************\n * EXPAND DOWN\n */\n.ladda-button[data-style=expand-down] {\n overflow: hidden;\n}\n.ladda-button[data-style=expand-down] .ladda-spinner {\n top: 62px;\n left: 50%;\n margin-left: 0;\n}\n.ladda-button[data-style=expand-down][data-size="s"] .ladda-spinner,\n .ladda-button[data-style=expand-down][data-size="xs"] .ladda-spinner {\n top: 40px;\n}\n.ladda-button[data-style=expand-down][data-loading] {\n padding-bottom: 54px;\n}\n.ladda-button[data-style=expand-down][data-loading] .ladda-spinner {\n opacity: 1;\n}\n.ladda-button[data-style=expand-down][data-loading][data-size="s"], .ladda-button[data-style=expand-down][data-loading][data-size="xs"] {\n padding-bottom: 32px;\n}\n\n/*************************************\n * SLIDE LEFT\n */\n.ladda-button[data-style=slide-left] {\n overflow: hidden;\n}\n.ladda-button[data-style=slide-left] .ladda-label {\n position: relative;\n}\n.ladda-button[data-style=slide-left] .ladda-spinner {\n left: 100%;\n margin-left: 0;\n}\n.ladda-button[data-style=slide-left][data-loading] .ladda-label {\n opacity: 0;\n left: -100%;\n}\n.ladda-button[data-style=slide-left][data-loading] .ladda-spinner {\n opacity: 1;\n left: 50%;\n}\n\n/*************************************\n * SLIDE RIGHT\n */\n.ladda-button[data-style=slide-right] {\n overflow: hidden;\n}\n.ladda-button[data-style=slide-right] .ladda-label {\n position: relative;\n}\n.ladda-button[data-style=slide-right] .ladda-spinner {\n right: 100%;\n margin-left: 0;\n left: 16px;\n}\n.ladda-button[data-style=slide-right][data-loading] .ladda-label {\n opacity: 0;\n left: 100%;\n}\n.ladda-button[data-style=slide-right][data-loading] .ladda-spinner {\n opacity: 1;\n left: 50%;\n}\n\n/*************************************\n * SLIDE UP\n */\n.ladda-button[data-style=slide-up] {\n overflow: hidden;\n}\n.ladda-button[data-style=slide-up] .ladda-label {\n position: relative;\n}\n.ladda-button[data-style=slide-up] .ladda-spinner {\n left: 50%;\n margin-left: 0;\n margin-top: 1em;\n}\n.ladda-button[data-style=slide-up][data-loading] .ladda-label {\n opacity: 0;\n top: -1em;\n}\n.ladda-button[data-style=slide-up][data-loading] .ladda-spinner {\n opacity: 1;\n margin-top: 0;\n}\n\n/*************************************\n * SLIDE DOWN\n */\n.ladda-button[data-style=slide-down] {\n overflow: hidden;\n}\n.ladda-button[data-style=slide-down] .ladda-label {\n position: relative;\n}\n.ladda-button[data-style=slide-down] .ladda-spinner {\n left: 50%;\n margin-left: 0;\n margin-top: -2em;\n}\n.ladda-button[data-style=slide-down][data-loading] .ladda-label {\n opacity: 0;\n top: 1em;\n}\n.ladda-button[data-style=slide-down][data-loading] .ladda-spinner {\n opacity: 1;\n margin-top: 0;\n}\n\n/*************************************\n * ZOOM-OUT\n */\n.ladda-button[data-style=zoom-out] {\n overflow: hidden;\n}\n.ladda-button[data-style=zoom-out] .ladda-spinner {\n left: 50%;\n margin-left: 32px;\n -webkit-transform: scale(2.5);\n -moz-transform: scale(2.5);\n -ms-transform: scale(2.5);\n -o-transform: scale(2.5);\n transform: scale(2.5);\n}\n.ladda-button[data-style=zoom-out] .ladda-label {\n position: relative;\n display: inline-block;\n}\n.ladda-button[data-style=zoom-out][data-loading] .ladda-label {\n opacity: 0;\n -webkit-transform: scale(0.5);\n -moz-transform: scale(0.5);\n -ms-transform: scale(0.5);\n -o-transform: scale(0.5);\n transform: scale(0.5);\n}\n.ladda-button[data-style=zoom-out][data-loading] .ladda-spinner {\n opacity: 1;\n margin-left: 0;\n -webkit-transform: none;\n -moz-transform: none;\n -ms-transform: none;\n -o-transform: none;\n transform: none;\n}\n\n/*************************************\n * ZOOM-IN\n */\n.ladda-button[data-style=zoom-in] {\n overflow: hidden;\n}\n.ladda-button[data-style=zoom-in] .ladda-spinner {\n left: 50%;\n margin-left: -16px;\n -webkit-transform: scale(0.2);\n -moz-transform: scale(0.2);\n -ms-transform: scale(0.2);\n -o-transform: scale(0.2);\n transform: scale(0.2);\n}\n.ladda-button[data-style=zoom-in] .ladda-label {\n position: relative;\n display: inline-block;\n}\n.ladda-button[data-style=zoom-in][data-loading] .ladda-label {\n opacity: 0;\n -webkit-transform: scale(2.2);\n -moz-transform: scale(2.2);\n -ms-transform: scale(2.2);\n -o-transform: scale(2.2);\n transform: scale(2.2);\n}\n.ladda-button[data-style=zoom-in][data-loading] .ladda-spinner {\n opacity: 1;\n margin-left: 0;\n -webkit-transform: none;\n -moz-transform: none;\n -ms-transform: none;\n -o-transform: none;\n transform: none;\n}\n\n/*************************************\n * CONTRACT\n */\n.ladda-button[data-style=contract] {\n overflow: hidden;\n width: 100px;\n}\n.ladda-button[data-style=contract] .ladda-spinner {\n left: 50%;\n margin-left: 0;\n}\n.ladda-button[data-style=contract][data-loading] {\n border-radius: 50%;\n width: 52px;\n}\n.ladda-button[data-style=contract][data-loading] .ladda-label {\n opacity: 0;\n}\n.ladda-button[data-style=contract][data-loading] .ladda-spinner {\n opacity: 1;\n}\n\n/*************************************\n * OVERLAY\n */\n.ladda-button[data-style=contract-overlay] {\n overflow: hidden;\n width: 100px;\n box-shadow: 0px 0px 0px 2000px transparent;\n}\n.ladda-button[data-style=contract-overlay] .ladda-spinner {\n left: 50%;\n margin-left: 0;\n}\n.ladda-button[data-style=contract-overlay][data-loading] {\n border-radius: 50%;\n width: 52px;\n /*outline: 10000px solid rgba( 0, 0, 0, 0.5 );*/\n box-shadow: 0px 0px 0px 2000px rgba(0, 0, 0, 0.8);\n}\n.ladda-button[data-style=contract-overlay][data-loading] .ladda-label {\n opacity: 0;\n}\n.ladda-button[data-style=contract-overlay][data-loading] .ladda-spinner {\n opacity: 1;\n}\n\n/*************************************\n * CONFIG\n */\n/*************************************\n * BUTTON THEME\n */\n.ladda-button {\n background: #666;\n border: 0;\n padding: 14px 18px;\n font-size: 18px;\n cursor: pointer;\n color: #fff;\n border-radius: 2px;\n border: 1px solid transparent;\n -webkit-appearance: none;\n -webkit-font-smoothing: antialiased;\n -webkit-tap-highlight-color: transparent;\n}\n.ladda-button:hover {\n border-color: rgba(0, 0, 0, 0.07);\n background-color: #888;\n}\n.ladda-button[data-color=green] {\n background: #2aca76;\n}\n.ladda-button[data-color=green]:hover {\n background-color: #38d683;\n}\n.ladda-button[data-color=blue] {\n background: #53b5e6;\n}\n.ladda-button[data-color=blue]:hover {\n background-color: #69bfe9;\n}\n.ladda-button[data-color=red] {\n background: #ea8557;\n}\n.ladda-button[data-color=red]:hover {\n background-color: #ed956e;\n}\n.ladda-button[data-color=purple] {\n background: #9973C2;\n}\n.ladda-button[data-color=purple]:hover {\n background-color: #a685ca;\n}\n.ladda-button[data-color=mint] {\n background: #16a085;\n}\n.ladda-button[data-color=mint]:hover {\n background-color: #19b698;\n}\n.ladda-button[disabled], .ladda-button[data-loading] {\n border-color: rgba(0, 0, 0, 0.07);\n}\n.ladda-button[disabled], .ladda-button[disabled]:hover, .ladda-button[data-loading], .ladda-button[data-loading]:hover {\n cursor: default;\n background-color: #999;\n}\n.ladda-button[data-size=xs] {\n padding: 4px 8px;\n}\n.ladda-button[data-size=xs] .ladda-label {\n font-size: 0.7em;\n}\n.ladda-button[data-size=s] {\n padding: 6px 10px;\n}\n.ladda-button[data-size=s] .ladda-label {\n font-size: 0.9em;\n}\n.ladda-button[data-size=l] .ladda-label {\n font-size: 1.2em;\n}\n.ladda-button[data-size=xl] .ladda-label {\n font-size: 1.5em;\n}\n',""])},function(n,t){function a(n,t){var a=n[1]||"",o=n[3];if(!o)return a;if(t&&"function"==typeof btoa){var d=e(o);return[a].concat(o.sources.map(function(n){return"/*# sourceURL="+o.sourceRoot+n+" */"})).concat([d]).join("\n")}return[a].join("\n")}function e(n){return"/*# sourceMappingURL=data:application/json;charset=utf-8;base64,"+btoa(unescape(encodeURIComponent(JSON.stringify(n))))+" */"}n.exports=function(n){var t=[];return t.toString=function(){return this.map(function(t){var e=a(t,n);return t[2]?"@media "+t[2]+"{"+e+"}":e}).join("")},t.i=function(n,a){"string"==typeof n&&(n=[[null,n,""]]);for(var e={},o=0;o=0&&t<=1},default:0}},watch:{loading:function(t){t?this.ladda.start():this.ladda.stop()},progress:function(t){this.ladda.setProgress(t)}},methods:{handleClick:function(t){this.$emit("click",t)}},mounted:function(){this.ladda=a.default.create(this.$refs.ladda),this.loading?this.ladda.start():this.ladda.stop()},beforeDestroy:function(){this.ladda.remove(),delete this.ladda}}},function(t,e,n){"use strict";Object.defineProperty(e,"__esModule",{value:!0});var o=n(0),a=function(t){return t&&t.__esModule?t:{default:t}}(o),r={install:function(t,e){t.component("vue-ladda",a.default)}};"undefined"!=typeof window&&window.Vue&&window.Vue.use(r),e.default=a.default},function(t,e,n){/*! * Ladda * http://lab.hakim.se/ladda * MIT licensed * * Copyright (C) 2016 Hakim El Hattab, http://hakim.se */ -!function(t,e){n.exports=e(a(6))}(0,function(n){"use strict";function t(n){if(void 0===n)return void console.warn("Ladda button target must be defined.");if(/ladda-button/i.test(n.className)||(n.className+=" ladda-button"),n.hasAttribute("data-style")||n.setAttribute("data-style","expand-right"),!n.querySelector(".ladda-label")){var t=document.createElement("span");t.className="ladda-label",l(n,t)}var a,e=n.querySelector(".ladda-spinner");e||(e=document.createElement("span"),e.className="ladda-spinner"),n.appendChild(e);var o,d={start:function(){return a||(a=i(n)),n.setAttribute("disabled",""),n.setAttribute("data-loading",""),clearTimeout(o),a.spin(e),this.setProgress(0),this},startAfter:function(n){return clearTimeout(o),o=setTimeout(function(){d.start()},n),this},stop:function(){return n.removeAttribute("disabled"),n.removeAttribute("data-loading"),clearTimeout(o),a&&(o=setTimeout(function(){a.stop()},1e3)),this},toggle:function(){return this.isLoading()?this.stop():this.start(),this},setProgress:function(t){t=Math.max(Math.min(t,1),0);var a=n.querySelector(".ladda-progress");0===t&&a&&a.parentNode?a.parentNode.removeChild(a):(a||(a=document.createElement("div"),a.className="ladda-progress",n.appendChild(a)),a.style.width=(t||0)*n.offsetWidth+"px")},enable:function(){return this.stop(),this},disable:function(){return this.stop(),n.setAttribute("disabled",""),this},isLoading:function(){return n.hasAttribute("data-loading")},remove:function(){clearTimeout(o),n.removeAttribute("disabled",""),n.removeAttribute("data-loading",""),a&&(a.stop(),a=null);for(var t=0,e=s.length;t32&&(o*=.8),t.hasAttribute("data-spinner-size")&&(o=parseInt(t.getAttribute("data-spinner-size"),10)),t.hasAttribute("data-spinner-color")&&(a=t.getAttribute("data-spinner-color")),t.hasAttribute("data-spinner-lines")&&(e=parseInt(t.getAttribute("data-spinner-lines"),10));var d=.2*o,i=.6*d,r=d<7?2:3;return new n({color:a||"#fff",lines:e||12,radius:d,length:i,width:r,zIndex:"auto",top:"auto",left:"auto",className:""})}function r(n){for(var t=[],a=0;a>1)+"px"})}for(var s,u=0,p=(d.lines-1)*(1-d.direction)/2;u',a)}p.addRule(".spin-vml","behavior:url(#default#VML)"),r.prototype.lines=function(n,e){function d(){return o(a("group",{coordsize:u+" "+u,coordorigin:-s+" "+-s}),{width:u,height:u})}function r(n,r,l){t(c,t(o(d(),{rotation:360/e.lines*n+"deg",left:~~r}),t(o(a("roundrect",{arcsize:e.corners}),{width:s,height:e.width,left:e.radius,top:-e.width>>1,filter:l}),a("fill",{color:i(e.color,n),opacity:e.opacity}),a("stroke",{opacity:0}))))}var l,s=e.length+e.width,u=2*s,p=2*-(e.width+e.length)+"px",c=o(d(),{position:"absolute",top:p,left:p});if(e.shadow)for(l=1;l<=e.lines;l++)r(l,-2,"progid:DXImageTransform.Microsoft.Blur(pixelradius=2,makeshadow=1,shadowopacity=.3)");for(l=1;l<=e.lines;l++)r(l);return t(n,c)},r.prototype.opacity=function(n,t,a,e){var o=n.firstChild;e=e.shadow&&e.lines||0,o&&t+ea.parts.length&&(e.parts.length=a.parts.length)}else{for(var i=[],o=0;o32&&(a*=.8),e.hasAttribute("data-spinner-size")&&(a=parseInt(e.getAttribute("data-spinner-size"),10)),e.hasAttribute("data-spinner-color")&&(n=e.getAttribute("data-spinner-color")),e.hasAttribute("data-spinner-lines")&&(o=parseInt(e.getAttribute("data-spinner-lines"),10));var r=.2*a,i=.6*r,s=r<7?2:3;return new t({color:n||"#fff",lines:o||12,radius:r,length:i,width:s,zIndex:"auto",top:"auto",left:"auto",className:""})}function s(t,e){var n=document.createRange();n.selectNodeContents(t),n.surroundContents(e),t.appendChild(e)}function u(t,a){if("function"==typeof t.addEventListener){var r=e(t),i=-1;t.addEventListener("click",function(){var e=!0,s=n(t,"FORM");if(void 0!==s&&!s.hasAttribute("novalidate"))if("function"==typeof s.checkValidity)e=s.checkValidity();else for(var u=o(s),d=0;d>1)+"px"})}for(var d,l=0,c=(r.lines-1)*(1-r.direction)/2;l',n)}d.addRule(".spin-vml","behavior:url(#default#VML)"),s.prototype.lines=function(t,o){function r(){return a(n("group",{coordsize:l+" "+l,coordorigin:-d+" "+-d}),{width:l,height:l})}function s(t,s,u){e(f,e(a(r(),{rotation:360/o.lines*t+"deg",left:~~s}),e(a(n("roundrect",{arcsize:o.corners}),{width:d,height:o.scale*o.width,left:o.scale*o.radius,top:-o.scale*o.width>>1,filter:u}),n("fill",{color:i(o.color,t),opacity:o.opacity}),n("stroke",{opacity:0}))))}var u,d=o.scale*(o.length+o.width),l=2*o.scale*d,c=-(o.width+o.length)*o.scale*2+"px",f=a(r(),{position:"absolute",top:c,left:c});if(o.shadow)for(u=1;u<=o.lines;u++)s(u,-2,"progid:DXImageTransform.Microsoft.Blur(pixelradius=2,makeshadow=1,shadowopacity=.3)");for(u=1;u<=o.lines;u++)s(u);return e(t,f)},s.prototype.opacity=function(t,e,n,o){var a=t.firstChild;o=o.shadow&&o.lines||0,a&&e+o