import { r as registerInstance, c as createEvent, h, g as getElement } from './index-cdf8e526.js';
import { m as modifiersToClass } from './utils-f909044c.js';

const radioCss = ".ibk-radio{padding:5px 0}.ibk-radio *{box-sizing:border-box}.ibk-radio__hidden{display:none}.ibk-radio__label{display:inline-flex;align-items:center;color:var(--grayText);cursor:pointer}.ibk-radio__icon{display:inline-flex;align-items:center;justify-content:center;min-height:18px;min-width:18px;border:2px solid var(--gray4);border-radius:50%;margin-right:7px;transition:var(--fast)}.ibk-radio__dot{display:block;height:10px;width:10px;border-radius:50%;background-color:var(--primaryGreen1);transform:scale(0);transition:var(--fast)}.ibk-radio__label:active{transform:translateY(1px)}.ibk-radio__text{font-family:var(--fontGeometria);font-size:14px;font-weight:500}.ibk-radio__text a{text-decoration:none;color:var(--primaryGreen1)}.ibk-radio__error-message{color:var(--extendedWatermelon1);font-size:12px;font-family:var(--fontMontserrat);font-weight:500;min-height:15px;margin-top:7px;display:block}.ibk-radio--selected .ibk-radio__icon{border-color:var(--primaryGreen1)}.ibk-radio--selected .ibk-radio__dot{transform:scale(1)}.ibk-radio--disabled{pointer-events:none}.ibk-radio--disabled .ibk-radio__icon{background-color:var(--gray4);border-color:var(--gray2)}.ibk-radio--error .ibk-radio__icon{border-color:var(--extendedWatermelon1)}.ibk-radio--right .ibk-radio__label{justify-content:space-between}.ibk-radio--right .ibk-radio__icon{margin-right:0;margin-left:7px;order:2}.ibk-radio--outline .ibk-radio__label{border:1px solid var(--gray4);border-radius:4px;padding:10px}.ibk-radio--full .ibk-radio__label{width:100%}.ibk-radio--focus .ibk-radio__icon{border-color:var(--primaryGreen1)}";

const IbkRadio = class {
  constructor(hostRef) {
    registerInstance(this, hostRef);
    this.onselect = createEvent(this, "onselect", 7);
    /** Estado activo del radio */
    this.selected = false;
    /** Estado inactivo del radio */
    this.disabled = false;
    /** Error en el radio */
    this.error = false;
    /** Cuando se encuentra dentro de un "ibk-form" al hacer submit si el radio se encuentra deseleccionado, mostrará un mensaje de error */
    this.required = false;
    /** Personaliza el mensaje de campo requerido */
    this.requiredMessage = 'Este campo es requerido';
    /** Determina la posición del ícono */
    this.iconPosition = 'left';
    /** El radio se verá envuelto en una caja */
    this.outline = false;
    /** Determina si el radio ocupa el 100% de la pantalla */
    this.full = false;
    /** El radio estará agrupado en "ibk-radio-group" */
    this._grouped = false;
    /** Estado focus del radio */
    this._focus = false;
    /** Configura la clase del componente basado en estados y modificadores */
    this.containerClass = () => {
      return modifiersToClass('ibk-radio', [
        this.iconPosition,
        { outline: this.outline },
        { selected: this.selected },
        { disabled: this.disabled },
        { error: this.error },
        { full: this.full },
        { focus: this._focus }
      ]);
    };
  }
  componentWillLoad() {
    this.groupVerification();
  }
  changeRadio() {
    this.host.setAttribute('selected', '');
    this.host.removeAttribute('error');
    this.onselect.emit({
      selected: this.selected,
      value: this.value
    });
  }
  /** Verificar si el checkbox se encuentra agrupado */
  groupVerification() {
    const grouper = this.host.closest('ibk-radio-group');
    this._grouped = grouper != null ? true : false;
  }
  onRadioFocusIn() { this._focus = true; }
  onRadioFocusOut() { this._focus = false; }
  render() {
    return (h("div", { class: this.containerClass() }, h("label", { class: "ibk-radio__label" }, h("input", { class: "ibk-radio__hidden", checked: this.selected, type: "radio", value: this.value }), h("span", { class: "ibk-radio__icon" }, h("i", { class: "ibk-radio__dot" })), h("span", { class: "ibk-radio__text", innerHTML: this.label })), (!this._grouped && this.error) && h("span", { class: "ibk-radio__error-message", innerHTML: this.requiredMessage })));
  }
  get host() { return getElement(this); }
};
IbkRadio.style = radioCss;

export { IbkRadio as ibk_radio };
