"use strict";(self["momentum-web-components-[id]"]=self["momentum-web-components-[id]"]||[]).push([[2708],{2708(t,e,r){var s,i=r(9609),a=r(4084),o=r(7161),p=r(429),l=r(5125),n=r(6631),h=function(t,e,r,s){var i,a=arguments.length,o=a<3?e:null===s?s=Object.getOwnPropertyDescriptor(e,r):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)o=Reflect.decorate(t,e,r,s);else for(var p=t.length-1;p>=0;p--)(i=t[p])&&(o=(a<3?i(o):a>3?i(e,r,o):i(e,r))||o);return a>3&&o&&Object.defineProperty(e,r,o),o};!function(t){let e=class extends o.LitElement{constructor(){super(...arguments),this.dynamic=!1,this.color="",this.label="",this.displayFormat="percentage",this.type="indeterminate",this.min=0,this.max=100,this.value=25,this.adjustedValue=0,this.valueFraction=0,this.meterWidth="100",this.getDisplayFormat=()=>"indeterminate"===this.type?(this.value=100,null):(this.adjustedValue=this.max-this.value<0?this.max:this.value,this.valueFraction=this.adjustedValue/this.max*100||0,this.meterWidth=this.valueFraction.toFixed(0)+"%","none"===this.displayFormat?null:"percentage"===this.displayFormat?this.meterWidth:`${this.adjustedValue} / ${this.max}`),this.getColor=()=>this.color?this.color:this.dynamic?this.valueFraction<25?"success":this.valueFraction<50?"info":this.valueFraction<75?"warning":"danger":void 0}connectedCallback(){super.connectedCallback(),this.requestUpdate("value")}static get styles(){return[a.A,n.A]}render(){const t={[`progress--${this.type}`]:this.type,[`progress--${this.color}`]:this.color};return o.html`
        <span>
          <div class="progressbar-info" data-key="${this.min}">
            <span class="progressbar-label">${this.label}</span>
            <span class="progressbar-progress">${this.getDisplayFormat()}</span>
          </div>
          <div class="progress ${(0,l.classMap)(t)}" data-key="${this.max}">
            <span
              class="meter"
              role="progressbar"
              aria-labelledby="progressbar"
              aria-valuenow=${this.adjustedValue}
              aria-valuemin=${this.min}
              aria-valuemax=${this.max}
              aria-valuetext=${this.meterWidth}
              style="${"width: "+this.meterWidth+"; background: "+this.getColor()}"
            >
            </span>
          </div>
        </span>
      `}};h([(0,p.property)({type:Boolean})],e.prototype,"dynamic",void 0),h([(0,p.property)({type:String})],e.prototype,"color",void 0),h([(0,p.property)({type:String})],e.prototype,"label",void 0),h([(0,p.property)({type:String})],e.prototype,"displayFormat",void 0),h([(0,p.property)({type:String})],e.prototype,"type",void 0),h([(0,p.property)({type:Number})],e.prototype,"min",void 0),h([(0,p.property)({type:Number})],e.prototype,"max",void 0),h([(0,p.property)({type:Number})],e.prototype,"value",void 0),h([(0,p.property)({type:Number})],e.prototype,"adjustedValue",void 0),h([(0,p.property)({type:Number})],e.prototype,"valueFraction",void 0),h([(0,p.property)({type:String})],e.prototype,"meterWidth",void 0),e=h([(0,i.w)("md-progress-bar")],e),t.ELEMENT=e}(s||(s={}))}}]);