import { h, Host } from '@stencil/core';
export class Progress {
  constructor() {
    this.percent = 0;
    this.showInfo = false;
    this.borderRadius = 0;
    this.fontSize = 16;
    this.strokeWidth = 6;
    this.activeColor = '#09BB07';
    this.backgroundColor = '#EBEBEB';
    this.active = false;
  }
  render() {
    const { percent, showInfo, borderRadius, fontSize, strokeWidth, activeColor, backgroundColor, active } = this;
    const pgPercent = percent > 100 ? 100 : percent < 0 ? 0 : percent;
    const pgHeight = {
      height: strokeWidth + 'px',
      backgroundColor
    };
    const transition = active ? 'width 1s ease-in-out' : 'none';
    const pgWidth = {
      width: `${pgPercent}%`,
      transition,
      WebkitTransition: transition,
      backgroundColor: activeColor,
      borderRadius: borderRadius ? `${borderRadius}px` : '0px'
    };
    return (h(Host, { class: 'weui-progress' }, h("div", { class: 'weui-progress__bar', style: pgHeight }, h("div", { class: 'weui-progress__inner-bar', style: pgWidth })), showInfo && (h("div", { class: 'weui-progress__opr', style: { 'font-size': `${fontSize}px` } }, h("span", null, pgPercent, "%")))));
  }
  static get is() { return "taro-progress-core"; }
  static get properties() {
    return {
      "percent": {
        "type": "number",
        "mutable": false,
        "complexType": {
          "original": "number",
          "resolved": "number",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "percent",
        "reflect": false,
        "defaultValue": "0"
      },
      "showInfo": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "show-info",
        "reflect": false,
        "defaultValue": "false"
      },
      "borderRadius": {
        "type": "any",
        "mutable": false,
        "complexType": {
          "original": "number | string",
          "resolved": "number | string",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "border-radius",
        "reflect": false,
        "defaultValue": "0"
      },
      "fontSize": {
        "type": "any",
        "mutable": false,
        "complexType": {
          "original": "number | string",
          "resolved": "number | string",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "font-size",
        "reflect": false,
        "defaultValue": "16"
      },
      "strokeWidth": {
        "type": "any",
        "mutable": false,
        "complexType": {
          "original": "number | string",
          "resolved": "number | string",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "stroke-width",
        "reflect": false,
        "defaultValue": "6"
      },
      "activeColor": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "active-color",
        "reflect": false,
        "defaultValue": "'#09BB07'"
      },
      "backgroundColor": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "background-color",
        "reflect": false,
        "defaultValue": "'#EBEBEB'"
      },
      "active": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "active",
        "reflect": false,
        "defaultValue": "false"
      }
    };
  }
}
//# sourceMappingURL=progress.js.map
