import { ElementIDUtils } from '@sankhyalabs/core';
import { h, Host } from '@stencil/core';
import { CheckMode } from './CheckMode';
export class EzCheck {
  constructor() {
    this.label = undefined;
    this.alternativePlaceholder = undefined;
    this.value = undefined;
    this.enabled = true;
    this.indeterminate = undefined;
    this.mode = CheckMode.REGULAR;
    this.compact = false;
  }
  observeValue(newValue, oldValue) {
    if (!this._inputElem)
      return;
    if (newValue != oldValue) {
      this._inputElem.checked = newValue;
    }
    if (this._inputElem.indeterminate != this.indeterminate) {
      this._inputElem.indeterminate = this.indeterminate;
    }
  }
  observeIndeterminate(newValue, oldValue) {
    if (!this._inputElem)
      return;
    if (newValue != oldValue) {
      this._inputElem.indeterminate = newValue;
    }
  }
  //---------------------------------------------
  // Public methods
  //---------------------------------------------
  /**
   * Obtém o modo escolhido.
   */
  async getMode() {
    return CheckMode[this.mode];
  }
  /**
   * Aplica o foco no campo.
   */
  async setFocus() {
    this._inputElem.focus();
  }
  componentDidLoad() {
    if (this._element) {
      ElementIDUtils.addIDInfo(this._element, 'input');
    }
  }
  changeValue() {
    if (!this.enabled) {
      return;
    }
    this.value = !this.value;
    this.ezChange.emit(this.value);
  }
  getLabelClasses() {
    const classes = ['label'];
    if (!this.enabled) {
      classes.push('label--disabled');
    }
    if (!this.compact) {
      classes.push('label--padding');
    }
    return classes.join(' ');
  }
  getInputClasses() {
    var _a;
    const classes = [''];
    classes.push(((_a = this.mode) === null || _a === void 0 ? void 0 : _a.toUpperCase()) === CheckMode.SWITCH ? 'switch-mode' : 'regular-mode');
    if (this.compact)
      classes.push('compact');
    return classes.join(' ');
  }
  render() {
    return (h(Host, null, h("input", { type: "checkbox", ref: (el) => this._inputElem = el, class: this.getInputClasses(), checked: this.value === true, onChange: () => {
        this.changeValue();
      }, indeterminate: this.indeterminate, disabled: !this.enabled, "data-element-id": ElementIDUtils.getInternalIDInfo('input') }), this.renderLabel()));
  }
  renderLabel() {
    if (!this.label)
      return undefined;
    return (h("label", { class: this.getLabelClasses(), onClick: () => this.changeValue(), title: this.label }, this.label, " ", this.alternativePlaceholder ? h("span", { class: "label-alternative" }, this.alternativePlaceholder) : undefined));
  }
  static get is() { return "ez-check"; }
  static get encapsulation() { return "shadow"; }
  static get originalStyleUrls() {
    return {
      "$": ["ez-check.css"]
    };
  }
  static get styleUrls() {
    return {
      "$": ["ez-check.css"]
    };
  }
  static get properties() {
    return {
      "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
      },
      "alternativePlaceholder": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "string",
          "resolved": "string",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Texto alternativo a ser apresentado como t\u00EDtulo do campo."
        },
        "attribute": "alternative-placeholder",
        "reflect": true
      },
      "value": {
        "type": "boolean",
        "mutable": true,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Define o valor do campo."
        },
        "attribute": "value",
        "reflect": true
      },
      "enabled": {
        "type": "boolean",
        "mutable": true,
        "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"
      },
      "indeterminate": {
        "type": "boolean",
        "mutable": true,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Se true ativa o estado indeterminado, nem marcado nem desmarcado (n\u00E3o dispon\u00EDvel em modo `switch`)."
        },
        "attribute": "indeterminate",
        "reflect": true
      },
      "mode": {
        "type": "string",
        "mutable": false,
        "complexType": {
          "original": "CheckMode",
          "resolved": "CheckMode.REGULAR | CheckMode.SWITCH",
          "references": {
            "CheckMode": {
              "location": "import",
              "path": "./CheckMode"
            }
          }
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Define o modo de visualiza\u00E7\u00E3o do ez-check."
        },
        "attribute": "mode",
        "reflect": true,
        "defaultValue": "CheckMode.REGULAR"
      },
      "compact": {
        "type": "boolean",
        "mutable": false,
        "complexType": {
          "original": "boolean",
          "resolved": "boolean",
          "references": {}
        },
        "required": false,
        "optional": false,
        "docs": {
          "tags": [],
          "text": "Define o modo compacto com espa\u00E7amento menor entre label e o input"
        },
        "attribute": "compact",
        "reflect": false,
        "defaultValue": "false"
      }
    };
  }
  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 methods() {
    return {
      "getMode": {
        "complexType": {
          "signature": "() => Promise<CheckMode>",
          "parameters": [],
          "references": {
            "Promise": {
              "location": "global"
            },
            "CheckMode": {
              "location": "import",
              "path": "./CheckMode"
            }
          },
          "return": "Promise<CheckMode>"
        },
        "docs": {
          "text": "Obt\u00E9m o modo escolhido.",
          "tags": []
        }
      },
      "setFocus": {
        "complexType": {
          "signature": "() => Promise<void>",
          "parameters": [],
          "references": {
            "Promise": {
              "location": "global"
            }
          },
          "return": "Promise<void>"
        },
        "docs": {
          "text": "Aplica o foco no campo.",
          "tags": []
        }
      }
    };
  }
  static get elementRef() { return "_element"; }
  static get watchers() {
    return [{
        "propName": "value",
        "methodName": "observeValue"
      }, {
        "propName": "indeterminate",
        "methodName": "observeIndeterminate"
      }];
  }
}
