import { h, Host } from "@stencil/core";
import { randomIdGenerator } from "../../../global/utils/randomIdGenerator/randomIdGenerator.util";
/**
 * @slot radiobuttons
 *
 * @swedishName Radiogrupp
 */
export class FormRadiogroup {
    constructor() {
        this.radiobuttons = undefined;
        this.afValue = undefined;
        this.value = undefined;
        this.afName = randomIdGenerator('digi-form-radiogroup');
    }
    OnAfValueChange(value) {
        this.value = value;
    }
    OnValueChange(value) {
        this.afValue = value;
        this.setRadiobuttons(value);
    }
    radiobuttonChangeListener(e) {
        if (Array.from(this.radiobuttons).includes(e.target)) {
            e.preventDefault();
            this.afValue = e.detail.target.value;
            this.afOnGroupChange.emit(e);
        }
    }
    componentDidLoad() {
        this.setRadiobuttons(this.value || this.afValue);
        if (this.value)
            this.afValue = this.value;
    }
    setRadiobuttons(value) {
        this.radiobuttons = this.hostElement.querySelectorAll('digi-form-radiobutton');
        this.radiobuttons.forEach((r) => {
            r.afName = this.afName;
            if (value && r.afValue == value) {
                r.setAttribute('af-checked', 'true');
            }
        });
    }
    render() {
        return (h(Host, { key: '32ecef2c08cd9f37a95d782d8f0e631ad4037c69' }, h("div", { key: '1d4606fe5a994d4b79113568349147874d15b6ad', class: {
                'digi-form-radiogroup': true
            } }, h("digi-util-mutation-observer", { key: '1facc76b33e1b65428b5205ee074af6ae511bc74', onAfOnChange: (e) => this.radiobuttonChangeListener(e) }, h("slot", { key: '7b006ed18743cf5fdf7c432b80674b753a347aa7' })))));
    }
    static get is() { return "digi-form-radiogroup"; }
    static get encapsulation() { return "scoped"; }
    static get originalStyleUrls() {
        return {
            "$": ["form-radiogroup.scss"]
        };
    }
    static get styleUrls() {
        return {
            "$": ["form-radiogroup.css"]
        };
    }
    static get properties() {
        return {
            "afValue": {
                "type": "string",
                "mutable": true,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [{
                            "name": "en",
                            "text": "Radiogroup value"
                        }],
                    "text": "V\u00E4rdet p\u00E5 radiogruppen"
                },
                "getter": false,
                "setter": false,
                "attribute": "af-value",
                "reflect": false
            },
            "value": {
                "type": "string",
                "mutable": true,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": true,
                "docs": {
                    "tags": [{
                            "name": "en",
                            "text": "Radiogroup value"
                        }, {
                            "name": "ignore",
                            "text": undefined
                        }],
                    "text": "V\u00E4rdet p\u00E5 radiogruppen"
                },
                "getter": false,
                "setter": false,
                "attribute": "value",
                "reflect": false
            },
            "afName": {
                "type": "string",
                "mutable": false,
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                },
                "required": false,
                "optional": false,
                "docs": {
                    "tags": [{
                            "name": "en",
                            "text": "Radiogroup name"
                        }],
                    "text": "Namnet p\u00E5 radiogruppen"
                },
                "getter": false,
                "setter": false,
                "attribute": "af-name",
                "reflect": false,
                "defaultValue": "randomIdGenerator('digi-form-radiogroup')"
            }
        };
    }
    static get states() {
        return {
            "radiobuttons": {}
        };
    }
    static get events() {
        return [{
                "method": "afOnGroupChange",
                "name": "afOnGroupChange",
                "bubbles": true,
                "cancelable": true,
                "composed": true,
                "docs": {
                    "tags": [{
                            "name": "en",
                            "text": "Event when value changes"
                        }],
                    "text": "Event n\u00E4r v\u00E4rdet \u00E4ndras"
                },
                "complexType": {
                    "original": "string",
                    "resolved": "string",
                    "references": {}
                }
            }];
    }
    static get elementRef() { return "hostElement"; }
    static get watchers() {
        return [{
                "propName": "afValue",
                "methodName": "OnAfValueChange"
            }, {
                "propName": "value",
                "methodName": "OnValueChange"
            }];
    }
}
