@beamimpact/web-sdk/dist/chunks/progress-bar-PMU_xI3L.esm.js

The Beam SDK enables brands to connect with their customers over shared values, not transactional discounts, to build stronger loyalty. Our integration achieves this by allowing customers to (a) choose a nonprofit where the brand will donate part of their

import{f as d,g as b,h as m,y as l}from"./lit-iNN5L_Qk.esm.js";var u=Object.defineProperty,c=Object.getOwnPropertyDescriptor,g=(s,a,t,e)=>{for(var r=e>1?void 0:e?c(a,t):a,i=s.length-1,n;i>=0;i--)(n=s[i])&&(r=(e?n(a,t,r):n(r))||r);return e&&r&&u(a,t,r),r};class o extends m{constructor(){super(...arguments),this.value=0,this.animateProgress=!0}render(){return l`<div class="progress-bar-container">
      <style>
        :host {
          --beam-ProgressBar-value: ${this.value};
        }
      </style>
      <div class="progress-bar"></div>
    </div>`}}o.styles=d`
    :host {
      display: inline-block;
      min-width: 20px;
    }

    .progress-bar-container {
      border-radius: var(--beam-ProgressBar-border-radius, 8px);
      height: var(--beam-ProgressBar-height, 8px);
      padding: 0;
      width: 100%;
      background: var(--beam-ProgressBar-color-background, lightgray);
      position: relative;
      border: var(--beam-ProgressBar-border-width, 1px) solid var(--beam-ProgressBar-color-border, currentColor);
      overflow: hidden;
    }

    @keyframes animate-bar {
      0% {
        width: 0;
      }

      100% {
        width: calc(var(--beam-ProgressBar-value) * 1%);
      }
    }

    .progress-bar {
      width: calc(var(--beam-ProgressBar-value, 0) * 1%);
      height: 100%;
      position: absolute;
      background: var(--beam-ProgressBar-color-bar, linear-gradient(to right, currentColor, currentColor));
      left: 0;
      bottom: 0;
      top: 0;
      background-clip: padding-box;
      animation-duration: calc(
        var(--beam-ProgressBar-animation-duration-base, 0s) + var(--beam-ProgressBar-animation-duration-variable, 0s) *
          var(--beam-ProgressBar-value) / 100
      );
      animation-iteration-count: 1;
      animation-name: animate-bar;
      animation-timing-function: linear;
      border-radius: var(--beam-ProgressBar-progress-border-radius, 8px);
    }
  `,g([b({type:Number})],o.prototype,"value",2),g([b({type:Boolean})],o.prototype,"animateProgress",2),customElements.get("beam-progress-bar")||customElements.define("beam-progress-bar",o);const p={"--beam-ProgressBar-border-radius":"8px","--beam-ProgressBar-progress-border-radius":"8px","--beam-ProgressBar-height":"8px","--beam-ProgressBar-color-background":"transparent","--beam-ProgressBar-border-width":"1px","--beam-ProgressBar-color-border":"currentColor","--beam-ProgressBar-color-bar":"currentColor","--beam-ProgressBar-animation-duration-base":"0s","--beam-ProgressBar-animation-duration-variable":"0s"};export{p};
//# sourceMappingURL=progress-bar-PMU_xI3L.esm.js.map