vue-doughnut-progress/dist/vue-doughnut-progress.min.js

An animated responsive circular progress for Vue 3

var VueDoughnutProgress=function(e){"use strict";function t(e,t){return function(e){if(Array.isArray(e))return e}(e)||function(e,t){var n=null==e?null:"undefined"!=typeof Symbol&&e[Symbol.iterator]||e["@@iterator"];if(null==n)return;var r,o,s=[],i=!0,a=!1;try{for(n=n.call(e);!(i=(r=n.next()).done)&&(s.push(r.value),!t||s.length!==t);i=!0);}catch(e){a=!0,o=e}finally{try{i||null==n.return||n.return()}finally{if(a)throw o}}return s}(e,t)||function(e,t){if(!e)return;if("string"==typeof e)return n(e,t);var r=Object.prototype.toString.call(e).slice(8,-1);"Object"===r&&e.constructor&&(r=e.constructor.name);if("Map"===r||"Set"===r)return Array.from(e);if("Arguments"===r||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r))return n(e,t)}(e,t)||function(){throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}()}function n(e,t){(null==t||t>e.length)&&(t=e.length);for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}var r={name:"VueDoughnutProgress",props:{radius:Number,color:String,thickness:Number,percent:Number,text:Object},computed:{dashoffset:function(){return this.dasharray-this.dasharray*this.percent/100},dasharray:function(){return 2*Math.PI*this.radius}}},o={class:"vue-doughnut-progress"},s=["width","height"],i=["cx","cy","r"],a=["cx","cy","r"],u=["innerHTML"];!function(e,t){void 0===t&&(t={});var n=t.insertAt;if(e&&"undefined"!=typeof document){var r=document.head||document.getElementsByTagName("head")[0],o=document.createElement("style");o.type="text/css","top"===n&&r.firstChild?r.insertBefore(o,r.firstChild):r.appendChild(o),o.styleSheet?o.styleSheet.cssText=e:o.appendChild(document.createTextNode(e))}}("\n.vue-doughnut-progress {\n  display: -webkit-box;\n  display: -ms-flexbox;\n  display: flex;\n  -webkit-box-pack: center;\n    -ms-flex-pack: center;\n        justify-content: center;\n  -webkit-box-align: center;\n    -ms-flex-align: center;\n        align-items: center;\n}\n.vue-doughnut-progress svg {\n  -webkit-transform: rotate(-90deg);    \n    transform: rotate(-90deg);\n  overflow: initial;\n}\n.vue-doughnut-progress span {\n  position: absolute;\n  font-family: Ubuntu;\n}\n.vue-doughnut-progress circle{\n  fill:none;\n}\n.vue-doughnut-progress circle:nth-child(1){\n  stroke: lightgray;\n}\n.vue-doughnut-progress circle:nth-child(2){\n  position: relative;\n  z-index: 1;    \n  -webkit-transition: stroke-dashoffset 1s;    \n  transition: stroke-dashoffset 1s;\n  stroke-linecap: round;\n}\n"),r.render=function(t,n,r,l,c,d){return e.openBlock(),e.createElementBlock("div",o,[(e.openBlock(),e.createElementBlock("svg",{width:2*r.radius,height:2*r.radius},[e.createElementVNode("circle",{cx:r.radius,cy:r.radius,r:r.radius,style:e.normalizeStyle({"stroke-width":r.thickness})},null,12,i),e.createElementVNode("circle",{cx:r.radius,cy:r.radius,r:r.radius,style:e.normalizeStyle({"stroke-dashoffset":d.dashoffset,"stroke-dasharray":d.dasharray,"stroke-width":r.thickness,stroke:r.color})},null,12,a)],8,s)),e.createElementVNode("span",{style:e.normalizeStyle({"font-weight":r.text.bold?"bold":"normal","font-size":r.text.size+"px"}),innerHTML:r.text.text},null,12,u)])};var l=function(){var e=r;return e.install=function(t){t.component("VueDoughnutProgress",e)},e}(),c=Object.freeze({__proto__:null,default:l});return Object.entries(c).forEach((function(e){var n=t(e,2),r=n[0],o=n[1];"default"!==r&&(l[r]=o)})),l}(Vue);