import { h } from "@stencil/core";
export class Status {
  constructor() {
    this.label = undefined;
    this.border = false;
    this.color = 'orange';
  }
  render() {
    const containerClass = this.border ? `container border-${this.color}` : 'container no-border';
    return (h("div", { "aria-label": "a status indicator", "aria-value": this.label, class: containerClass }, h("span", { class: `dot ${this.color}` }), h("p", { class: "text" }, this.label)));
  }
  static get is() { return "ifx-status"; }
  static get encapsulation() { return "shadow"; }
  static get originalStyleUrls() {
    return {
      "$": ["status.scss"]
    };
  }
  static get styleUrls() {
    return {
      "$": ["status.css"]
    };
  }
  static get properties() {
    return {
      "label": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "label",
        "reflect": false
      },
      "border": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "border",
        "reflect": false,
        "defaultValue": "false"
      },
      "color": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "'orange' | 'ocean' | 'grey' | 'light-grey' | 'red' | 'green' | 'berry'",
          "resolved": "\"berry\" | \"green\" | \"grey\" | \"light-grey\" | \"ocean\" | \"orange\" | \"red\"",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": ""
        },
        "attribute": "color",
        "reflect": false,
        "defaultValue": "'orange'"
      }
    };
  }
}
//# sourceMappingURL=status.js.map