import { ElementIDUtils } from '@sankhyalabs/core';
import { Host, h } from '@stencil/core';
export class EzRadioButton {
  constructor() {
    this.value = undefined;
    this.options = [];
    this.enabled = true;
    this.label = undefined;
    this.direction = "vertical";
  }
  componentDidLoad() {
    if (this.hostElement) {
      ElementIDUtils.addIDInfo(this.hostElement, 'input');
    }
  }
  componentWillRender() {
    this._options = [...this.options];
    const optionsTags = this.hostElement.querySelectorAll("ez-radio-button-option");
    if (optionsTags) {
      optionsTags.forEach(e => {
        let label = e.getAttribute("label");
        let value = e.getAttribute("value");
        this._options.push({ label, value });
      });
    }
  }
  handleInputChange(ev) {
    const slot = ev.target;
    this.value = slot.value;
    this.ezChange.emit(this.value);
  }
  render() {
    return (h(Host, null, this.label && h("label", { class: "label" }, this.label), h("div", { class: "form form--" + this.direction }, this._options.map((option, key) => h("div", { class: "form__group" }, h("input", { id: "rad" + key, class: "form__radio", name: "theradio", type: "radio", value: option.value, onChange: (ev) => { this.handleInputChange(ev); }, disabled: !this.enabled, checked: option.value === this.value, "data-element-id": ElementIDUtils.getInternalIDInfo(`input_${option.value}`) }), h("label", { htmlFor: "rad" + key, class: "form__label" }, option.label))))));
  }
  static get is() { return "ez-radio-button"; }
  static get encapsulation() { return "shadow"; }
  static get originalStyleUrls() {
    return {
      "$": ["ez-radio-button.css"]
    };
  }
  static get styleUrls() {
    return {
      "$": ["ez-radio-button.css"]
    };
  }
  static get properties() {
    return {
      "value": {
        "type": "any",
        "mutable": true,
        "complexType": {
          "original": "any",
          "resolved": "any",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Define o valor do campo."
        },
        "attribute": "value",
        "reflect": true
      },
      "options": {
        "type": "unknown",
        "mutable": true,
        "complexType": {
          "original": "Array<Radio>",
          "resolved": "Radio[]",
          "references": {
            "Array": {
              "location": "global"
            },
            "Radio": {
              "location": "local"
            }
          }
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Define as op\u00E7\u00F5es que ser\u00E3o apresentadas"
        },
        "defaultValue": "[]"
      },
      "enabled": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Se false o usu\u00E1rio n\u00E3o pode interagir com o campo."
        },
        "attribute": "enabled",
        "reflect": true,
        "defaultValue": "true"
      },
      "label": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Texto a ser apresentado como t\u00EDtulo do campo."
        },
        "attribute": "label",
        "reflect": true
      },
      "direction": {
        "type": "string",
        "mutable": true,
        "complexType": {
          "original": "\"vertical\" | \"horizontal\"",
          "resolved": "\"horizontal\" | \"vertical\"",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Define a dire\u00E7\u00E3o dos itens."
        },
        "attribute": "direction",
        "reflect": true,
        "defaultValue": "\"vertical\""
      }
    };
  }
  static get events() {
    return [{
        "method": "ezChange",
        "name": "ezChange",
        "bubbles": true,
        "cancelable": true,
        "composed": true,
        "docs": {
          "tags": [],
          "text": "Emitido quando acontece a altera\u00E7\u00E3o de valor do campo."
        },
        "complexType": {
          "original": "any",
          "resolved": "any",
          "references": {}
        }
      }];
  }
  static get elementRef() { return "hostElement"; }
}
