import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
import { o as inputRadioInvalid, p as inputRadioCheckedFocused, q as inputRadioChecked, r as inputRadioFocused, s as inputRadio, l as label } from './parts.js';
import { d as defineCustomElement$1 } from './form-control-help-text3.js';

const FormControlRadio = /*@__PURE__*/ proxyCustomElement(class FormControlRadio extends HTMLElement {
    constructor(registerHost) {
        super();
        if (registerHost !== false) {
            this.__registerHost();
        }
        this.formControlInput = createEvent(this, "formControlInput", 7);
        this.formControlBlur = createEvent(this, "formControlBlur", 7);
        this.isFocused = false;
        this.inputHandler = () => { };
        this.disabled = false;
        this.errorText = '';
        this.handleFormControlInput = (event) => {
            const target = event.target;
            const name = target.getAttribute('name');
            this.inputHandler(name, this.value);
            this.formControlInput.emit({ name, value: this.value });
        };
    }
    get part() {
        if (this.errorText) {
            return inputRadioInvalid;
        }
        if (this.isFocused && this.checked) {
            return inputRadioCheckedFocused;
        }
        if (this.checked) {
            return inputRadioChecked;
        }
        if (this.isFocused) {
            return inputRadioFocused;
        }
        return inputRadio;
    }
    render() {
        return (h(Host, { key: '0c6362e375e04d23c7e31a6be9ea6a43fbfdaac2', class: 'form-group d-flex flex-column' }, h("div", { key: '81b22f74d5b872318e121a2be0cbd8108c3f32ec', class: "form-check" }, h("input", { key: '903e8b0ad9cb30241d175da091de758bf4ac2471', ref: el => (this.radioElement = el), type: "radio", id: `${this.name}-${this.value}`, name: this.name, onFocus: () => this.isFocused = true, onBlur: () => {
                this.isFocused = false;
                this.formControlBlur.emit();
            }, onChange: this.handleFormControlInput, part: this.part, class: this.errorText ? 'form-check-input is-invalid' : 'form-check-input', disabled: this.disabled, value: this.value, checked: this.checked }), h("label", { key: 'df1402687b5965cbbd41ab65dc3de46a2e6e86b8', class: "form-check-label", htmlFor: `${this.name}-${this.value}`, part: label }, this.label)), h("form-control-help-text", { key: 'cf5498002674765b9cc5a0a09be1851be4221e9f', helpText: this.helpText, name: this.name }), h("form-control-error-text", { key: 'c5b50668f0451d1d5cbf94c1399057758ac93a5e', errorText: this.errorText, name: this.name })));
    }
}, [256, "form-control-radio", {
        "label": [8],
        "name": [8],
        "value": [1],
        "helpText": [1, "help-text"],
        "inputHandler": [16],
        "disabled": [4],
        "errorText": [1, "error-text"],
        "checked": [4],
        "isFocused": [32]
    }]);
function defineCustomElement() {
    if (typeof customElements === "undefined") {
        return;
    }
    const components = ["form-control-radio", "form-control-help-text"];
    components.forEach(tagName => { switch (tagName) {
        case "form-control-radio":
            if (!customElements.get(tagName)) {
                customElements.define(tagName, FormControlRadio);
            }
            break;
        case "form-control-help-text":
            if (!customElements.get(tagName)) {
                defineCustomElement$1();
            }
            break;
    } });
}
defineCustomElement();

export { FormControlRadio as F, defineCustomElement as d };
