simple-circular-progress/dist/simple-circular-progress/p-310d48b4.entry.js

Simple circular progress bar to be use in ionic, Angular and React

import{r as t,h as e}from"./p-fc014f3d.js";const i=class{constructor(e){t(this,e),this.progressPercentage="10",this.progressColor="#2ecc71",this.progressStrokeColor="#e4e4e4ee",this.label="",this.labelFontSize="1.5rem",this.hideLabel=!1}render(){return e("div",{style:{width:"100%",height:"100%",display:"flex",alignItems:"center",justifyContent:"center",background:`conic-gradient(${this.progressColor} ${this.progressPercentage}%, 0, ${this.progressStrokeColor} ${(100-parseInt(this.progressPercentage)).toString()}%)`,borderRadius:"50%",boxShadow:"inset 1px 1px 4px 1px"}},e("div",{style:{display:"flex",alignItems:"center",textAlign:"center",justifyContent:"center",backgroundColor:"#fff",height:"80%",width:"80%",borderRadius:"50%",boxShadow:"0px 0px 7px 0px rgba(0, 0, 0, 0.1)"}},(()=>{if(!this.hideLabel)return e("span",{style:{fontFamily:'"Helvetica Neue", Helvetica, Arial, Verdana, sans-serif',fontSize:""+this.labelFontSize,fontWeight:"lighter"},innerHTML:""===this.label||null==this.label?this.progressPercentage+"%":this.label})})()))}};i.style="";export{i as simple_circular_progress}