import { h, } from "@stencil/core";
import { getThumbnail } from "../utils";
export class Option {
  constructor() {
    this.callSelect = () => this.select();
    this.image = undefined;
    this.label = undefined;
    this.value = undefined;
  }
  select() {
    this.glOptionChanged.emit(this.value);
  }
  getRadio() {
    const field = this.el.closest("gl-field");
    const checked = field.getValue() === this.value;
    return (h("ion-item", null, getThumbnail(this), h("ion-radio", { onIonSelect: this.callSelect, value: this.value, checked: checked }, h("ion-label", { "text-wrap": true }, this.label))));
  }
  getSelectOption() {
    return (h("ion-select-option", { value: this.value }, this.label));
  }
  render() {
    let field = this.el.closest("gl-field");
    return field.widget === "radio" ? this.getRadio() : this.getSelectOption();
  }
  static get is() { return "gl-option"; }
  static get properties() {
    return {
      "image": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Thumbnail image URL."
        },
        "attribute": "image",
        "reflect": false
      },
      "label": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Option label. It is displayed to the user."
        },
        "attribute": "label",
        "reflect": false
      },
      "value": {
        "type": "any",
        "mutable": false,
        "complexType": {
          "original": "any",
          "resolved": "any",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Option value. If this option is selected, it is used to set the value\nof the property corresponding to the parent field."
        },
        "attribute": "value",
        "reflect": false
      }
    };
  }
  static get events() {
    return [{
        "method": "glOptionChanged",
        "name": "glOptionChanged",
        "bubbles": true,
        "cancelable": true,
        "composed": true,
        "docs": {
          "tags": [],
          "text": "Emitted when the option is selected or deselected."
        },
        "complexType": {
          "original": "any",
          "resolved": "any",
          "references": {}
        }
      }];
  }
  static get elementRef() { return "el"; }
}
//# sourceMappingURL=option.js.map
