import { h, Host } from '@stencil/core';
export class EzProgressBar {
  constructor() {
    this.percent = undefined;
    this.label = undefined;
    this.helpText = undefined;
  }
  renderHeader() {
    if (!this.label)
      return;
    return (h("div", { class: "ez-progress-bar__header" }, h("span", { class: 'ez-progress-bar__header-label' }, this.label), h("span", { class: 'ez-progress-bar__header-percent' }, this.percent, "%")));
  }
  renderHelpText() {
    if (!this.helpText)
      return;
    return (h("div", { class: "ez-progress-bar__help-text" }, this.helpText));
  }
  render() {
    return (h(Host, null, this.renderHeader(), h("div", { class: "progress-bar__container" }, h("div", { class: "progress-bar__content", style: { width: `${this.percent}%` } })), this.renderHelpText()));
  }
  static get is() { return "ez-progress-bar"; }
  static get encapsulation() { return "scoped"; }
  static get originalStyleUrls() {
    return {
      "$": ["ez-progress-bar.css"]
    };
  }
  static get styleUrls() {
    return {
      "$": ["ez-progress-bar.css"]
    };
  }
  static get properties() {
    return {
      "percent": {
        "type": "number",
        "mutable": false,
        "complexType": {
          "original": "number",
          "resolved": "number",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "Porcentagem de preenchimento da barra."
        },
        "attribute": "percent",
        "reflect": true
      },
      "label": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "R\u00F3tulo da barra de progresso."
        },
        "attribute": "label",
        "reflect": true
      },
      "helpText": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string",
          "references": {}
        },
        "required": false,
        "optional": true,
        "docs": {
          "tags": [],
          "text": "Mensagem auxiliar para contextualizar barra de carregamento."
        },
        "attribute": "help-text",
        "reflect": true
      }
    };
  }
}
