@riverty/web-components 6.2.1 → 6.3.0

package/dist/collection/components/radio-group/radio-group.js

@@ -1,1020 +0,0 @@
-import { Host, h } from "@stencil/core";
-import { appendControlToFormData } from "../../utils/formData";
-export class RadioGroup {
-    constructor() {
-        /** Controls the style variation of the radio buttons. */
-        this.variant = 'standard';
-        /**
-         * When set to `true`, automatically focuses the first enabled radio button in the group on mount.
-         * This will focus the selected radio button if one exists, or the first enabled radio button otherwise.
-         */
-        this.autofocus = false;
-        this.validityState = '';
-        this.validityMessage = '';
-        /**
-         * Initial attributes state
-         * */
-        this.initial = {};
-        /** Unique id */
-        this.uniqueId = `r-radio-group-${Date.now().toString(32)}${Math.random().toString(32)}`.replace(/\./g, '');
-        this.getValidityStateData = element => {
-            let validityState = '';
-            let validityMessage = '';
-            if (element === null)
-                return { validityState, validityMessage };
-            for (const state in element.validity) {
-                if (element.validity[state]) {
-                    validityState = state;
-                    if (this[state + 'Message']) {
-                        validityMessage = this[state + 'Message'];
-                        return { validityState, validityMessage };
-                    }
-                    validityMessage = element.validationMessage;
-                }
-            }
-            return { validityState, validityMessage };
-        };
-        this.validateFormElement = (element = null) => {
-            if (element === null)
-                return;
-            if (this.isNoValidate)
-                return;
-            if (this.error)
-                return;
-            const { validityState, validityMessage } = this.getValidityStateData(element);
-            this.validityState = validityState;
-            this.validityMessage = validityMessage;
-            const isValid = this.validityState === 'valid';
-            this.valid = isValid;
-            this.invalid = !isValid;
-            this.rValidate.emit({
-                state: this.validityState,
-                message: this.validityMessage
-            });
-        };
-        this.onSubmitForm = (event) => {
-            if (this.isNoValidate)
-                return;
-            this.validateFormElement(this.nativeSelectedEl || this.nativeFirstEl);
-            if (!this.hasSelected || this.invalid) {
-                event.preventDefault();
-                event.stopPropagation();
-            }
-        };
-        this.onResetForm = () => {
-            this.reset();
-        };
-        this.onLabelClick = () => {
-            const radioButtonEl = this.radioButtonElements[0].shadowRoot.querySelector('[type="radio"]');
-            radioButtonEl === null || radioButtonEl === void 0 ? void 0 : radioButtonEl.focus();
-        };
-        this.contributeToFormData = (event) => {
-            appendControlToFormData(this.host, event.formData);
-        };
-        /**
-         * Handles parent radio group value changes for nested groups.
-         * If this is a nested group with a parentValue specified, it will reset when
-         * the parent group's value changes to something other than the parentValue.
-         */
-        this.onParentGroupChange = (event) => {
-            // Only proceed if this group has a parentValue specified (indicating it's nested)
-            if (!this.parentValue)
-                return;
-            const parentNewValue = event.detail.value;
-            // If parent changed to a different value than our parentValue, reset this nested group
-            if (parentNewValue !== this.parentValue) {
-                this.clearValue();
-                // Emit rReset event to notify that the nested group was automatically reset
-                this.rReset.emit({
-                    element: this.host,
-                    value: null
-                });
-            }
-        };
-    }
-    rChangeAction(event) {
-        // Only handle events from direct children, not from nested radio-groups
-        const targetElement = event.target;
-        const isDirectChild = targetElement.parentElement === this.host;
-        if (!isDirectChild) {
-            return; // Ignore events from nested radio-groups
-        }
-        // Stop event from bubbling to parent radio-groups
-        event.stopPropagation();
-        this.resetValidity();
-        this.setValue(event.detail.value);
-    }
-    /**
-     * Resets the radio group to its initial state.
-     * This method clears the validity state and message, and sets the value and validity
-     * to their initial values.
-     */
-    radioButtonClickAction(event) {
-        // Only handle events from direct children, not from nested radio-groups
-        const targetElement = event.target;
-        const isDirectChild = targetElement.parentElement === this.host;
-        if (!isDirectChild) {
-            return; // Ignore events from nested radio-groups
-        }
-        // Stop event from bubbling to parent radio-groups
-        event.stopPropagation();
-        !event.target.disabled && event.target.select();
-    }
-    get selectedIndex() {
-        return Array.from(this.radioButtonElements).findIndex(el => el.hasAttribute('checked'));
-    }
-    get prevIndex() {
-        const isNoSelected = this.selectedIndex === -1;
-        const isnativeFirstElement = this.selectedIndex === 0;
-        return isnativeFirstElement || isNoSelected ? this.radioButtonElements.length - 1 : this.selectedIndex - 1;
-    }
-    get focusedRadioButtonEl() {
-        // Query all descendants to find focused element, but it will only be used for direct children
-        return this.host.querySelector('r-radio-button.focused');
-    }
-    get focusedRadioButtonElIndex() {
-        return Array.from(this.radioButtonElements).indexOf(this.focusedRadioButtonEl);
-    }
-    get nextIndex() {
-        const isNoSelected = this.selectedIndex === -1;
-        if (isNoSelected) {
-            return this.focusedRadioButtonElIndex === -1 ? 0 : this.focusedRadioButtonElIndex + 1;
-        }
-        const isLastElement = this.selectedIndex === this.radioButtonElements.length - 1;
-        return isLastElement ? 0 : this.selectedIndex + 1;
-    }
-    radioButtonKeydownAction(event) {
-        var _a;
-        // Only handle events from direct children, not from nested radio-groups
-        const targetElement = event.target;
-        const isDirectChild = targetElement.parentElement === this.host;
-        if (!isDirectChild) {
-            return; // Ignore events from nested radio-groups
-        }
-        // Stop event from bubbling to parent radio-groups
-        event.stopPropagation();
-        switch (event.detail.code) {
-            case 'ArrowUp':
-            case 'ArrowLeft':
-                // Select previous radio button
-                this.radioButtonElements[this.prevIndex].select();
-                break;
-            case 'ArrowDown':
-            case 'ArrowRight':
-                // Select next radio button
-                this.radioButtonElements[this.nextIndex].select();
-                break;
-            case 'Enter': {
-                const submitEl = this.host.querySelector('[type="submit"]') ||
-                    ((_a = this.parentFormEl) === null || _a === void 0 ? void 0 : _a.querySelector('[type="submit"]'));
-                if (submitEl && 'triggerClick' in submitEl) {
-                    submitEl === null || submitEl === void 0 ? void 0 : submitEl.triggerClick();
-                }
-                else {
-                    this.parentFormEl.requestSubmit();
-                }
-                break;
-            }
-        }
-    }
-    /**
-     * Resets the validity state and message of the radio group.
-     * This method clears the validity message and state, and sets the invalid
-     * property to its initial value.
-     */
-    async resetValidity() {
-        this.validityMessage = null;
-        this.validityState = null;
-        this.invalid = this.initial['invalid'];
-        this.valid = !this.invalid;
-    }
-    /**
-     * Resets the radio group to its initial state.
-     *
-     * This method:
-     * - clears the validity state and message,
-     * - sets the value and validity to initial values,
-     * - if no initial value the radio group will be deselected,
-     * - restores the tabindex on the first element.
-     */
-    async reset() {
-        this.resetValidity();
-        if (this.initial['value']) {
-            this.setValue(this.initial['value']);
-            return;
-        }
-        // Set default value to null
-        this.clearValue();
-    }
-    /**
-     * Sets the value of the radio group to the specified value.
-     * If a radio button with the specified value exists, it will be selected.
-     *
-     * @param value - The value to set for the radio group.
-     */
-    async setValue(value) {
-        const element = Array.from(this.radioButtonElements).find(el => el.value === value);
-        if (element === undefined) {
-            this.clearValue();
-            return;
-        }
-        this.value = value;
-        element === null || element === void 0 ? void 0 : element.select();
-    }
-    /**
-     * Gets the current value of the radio group.
-     *
-     * @returns The current value of the radio group.
-     */
-    async getValue() {
-        return this.value || null;
-    }
-    /**
-     * Clears the value of the radio group and deselects all radio buttons.
-     * This method sets the value to null and deselects all radio buttons in the group.
-     */
-    async clearValue() {
-        var _a, _b, _c, _d, _e, _f;
-        const isSelectedEqualsFirst = ((_a = this.nativeSelectedEl) === null || _a === void 0 ? void 0 : _a.value) === ((_b = this.nativeFirstEl) === null || _b === void 0 ? void 0 : _b.value);
-        if (!isSelectedEqualsFirst) {
-            (_c = this.nativeSelectedEl) === null || _c === void 0 ? void 0 : _c.setAttribute('tabindex', '-1');
-        }
-        (_d = this.nativeSelectedEl) === null || _d === void 0 ? void 0 : _d.setAttribute('tabindex', '-1');
-        (_e = this.nativeFirstEl) === null || _e === void 0 ? void 0 : _e.setAttribute('tabindex', '0');
-        (_f = this.selectedRadioButtonElement) === null || _f === void 0 ? void 0 : _f.removeAttribute('checked');
-        this.value = null;
-    }
-    /**
-     * Validates the radio group without triggering UI and returns a boolean indicating its validity.
-     * @returns A boolean indicating whether the radio group is valid.
-     */
-    async checkValidity() {
-        const element = this.nativeSelectedEl || this.nativeFirstEl || null;
-        const { validityState } = this.getValidityStateData(element);
-        return validityState === 'valid';
-    }
-    /**
-     * Validates the radio group and displays the validity state.
-     */
-    async reportValidity() {
-        const element = this.nativeSelectedEl || this.nativeFirstEl || null;
-        this.validateFormElement(element);
-        return this.validityState === 'valid';
-    }
-    /**
-     * Sets a custom validity message for the radio group.
-     * If the message is not empty, the radio group will be considered invalid.
-     *
-     * @param message - The custom validity message to set.
-     */
-    async setCustomValidity(message) {
-        const element = this.nativeSelectedEl || this.nativeFirstEl || null;
-        this.customErrorMessage = message;
-        this.validateFormElement(element);
-    }
-    /**
-     * Sets focus on the radio button element.
-     * */
-    async setFocus() {
-        const element = this.selectedRadioButtonElement || this.radioButtonElements[0] || null;
-        element === null || element === void 0 ? void 0 : element.setFocus();
-    }
-    /**
-     * Blurs the radio button element.
-     * */
-    async setBlur() {
-        var _a;
-        (_a = this.focusedRadioButtonEl) === null || _a === void 0 ? void 0 : _a.setBlur();
-    }
-    /** Determine whether this element should be ignored during Constraint Validation API validation. */
-    get isNoValidate() {
-        var _a;
-        return (((_a = this.parentFormEl) === null || _a === void 0 ? void 0 : _a.hasAttribute('novalidate')) ||
-            this.novalidate ||
-            !this.required ||
-            false);
-    }
-    /** Identify wrapping form element */
-    get parentFormEl() {
-        return this.host.closest('form') || document.querySelector(`#${this.form}`) || null;
-    }
-    get radioButtonElements() {
-        // Use :scope > to only select direct children, excluding nested radio-group buttons
-        return this.host.querySelectorAll(':scope > r-radio-button:not([disabled]:not([disabled="false"]))');
-    }
-    get selectedRadioButtonElement() {
-        return Array.from(this.radioButtonElements).find(el => el.checked || el.hasAttribute('checked')) || null;
-    }
-    get hasSelected() {
-        return Array.from(this.radioButtonElements).some(el => el.checked || el.hasAttribute('checked'));
-    }
-    get nativeSelectedEl() {
-        var _a, _b;
-        if (this.selectedRadioButtonElement === null)
-            return null;
-        return ((_b = (_a = this.selectedRadioButtonElement) === null || _a === void 0 ? void 0 : _a.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('.r-radio-button--input')) || null;
-    }
-    get nativeFirstEl() {
-        var _a, _b;
-        return ((_b = (_a = this.radioButtonElements[0]) === null || _a === void 0 ? void 0 : _a.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('.r-radio-button--input')) || null;
-    }
-    passPropsToGroupItems(props = {}) {
-        Object.entries(props).forEach(([key, value]) => {
-            this.radioButtonElements.forEach(el => {
-                if (typeof value === 'string')
-                    el.setAttribute(key, value);
-                if (typeof value === 'boolean' && value)
-                    el.setAttribute(key, '');
-            });
-        });
-    }
-    selectGroupItemByValue() {
-        if (this.hasSelected && !this.value) {
-            this.value = this.selectedRadioButtonElement.value;
-        }
-        this.setValue(this.value);
-    }
-    setTabindex() {
-        const el = this.nativeSelectedEl || this.nativeFirstEl;
-        el === null || el === void 0 ? void 0 : el.setAttribute('tabindex', '0');
-    }
-    get parentRadioGroup() {
-        var _a;
-        // Find the parent radio group element
-        return ((_a = this.host.parentElement) === null || _a === void 0 ? void 0 : _a.closest('r-radio-group')) || null;
-    }
-    connectFormEventListeners() {
-        var _a, _b, _c;
-        (_a = this.parentFormEl) === null || _a === void 0 ? void 0 : _a.addEventListener('formdata', this.contributeToFormData);
-        (_b = this.parentFormEl) === null || _b === void 0 ? void 0 : _b.addEventListener('reset', this.onResetForm);
-        (_c = this.parentFormEl) === null || _c === void 0 ? void 0 : _c.addEventListener('submit', this.onSubmitForm, { capture: true });
-    }
-    disconnectFormEventListeners() {
-        var _a, _b, _c;
-        (_a = this.parentFormEl) === null || _a === void 0 ? void 0 : _a.removeEventListener('formdata', this.contributeToFormData);
-        (_b = this.parentFormEl) === null || _b === void 0 ? void 0 : _b.removeEventListener('reset', this.onResetForm);
-        (_c = this.parentFormEl) === null || _c === void 0 ? void 0 : _c.removeEventListener('submit', this.onSubmitForm);
-    }
-    connectParentGroupListener() {
-        // Only connect if this is a nested group (has parentValue specified)
-        if (this.parentValue && this.parentRadioGroup) {
-            this.parentRadioGroup.addEventListener('rChange', this.onParentGroupChange);
-        }
-    }
-    disconnectParentGroupListener() {
-        if (this.parentValue && this.parentRadioGroup) {
-            this.parentRadioGroup.removeEventListener('rChange', this.onParentGroupChange);
-        }
-    }
-    get ariaDescribedBy() {
-        const messageId = `${this.uniqueId}-message`;
-        return this.hint ? `${this.uniqueId}-hint ${messageId}` : messageId;
-    }
-    connectedCallback() {
-        this.connectFormEventListeners();
-        this.connectParentGroupListener();
-    }
-    disconnectedCallback() {
-        this.disconnectFormEventListeners();
-        this.disconnectParentGroupListener();
-    }
-    componentWillLoad() {
-        const { required, name } = this;
-        this.passPropsToGroupItems({ required, name });
-        // If `value` is provided: item within group with such value shall be selected
-        this.selectGroupItemByValue();
-        this.initial['value'] = this.value;
-        this.initial['invalid'] = this.invalid;
-    }
-    componentDidLoad() {
-        const { name, required } = this;
-        this.passPropsToGroupItems({ name, required });
-        this.setTabindex();
-        if (this.autofocus) {
-            // Use setTimeout to ensure setValue has completed and checked state is synced
-            setTimeout(() => {
-                this.setFocus();
-            }, 0);
-        }
-    }
-    render() {
-        const { label, hint, fieldIndicator, error, uniqueId, invalid } = this;
-        const fieldsetAttrs = {
-            'aria-invalid': `${invalid || false}`,
-            'aria-describedby': this.ariaDescribedBy
-        };
-        return (h(Host, { key: 'bd1b1d42f3efab78cf0a2cce7b1a1e2568f21765' }, h("fieldset", Object.assign({ key: 'c449667b014cf8aeea4176b0d94c82573b661182', class: "r-radio-group" }, fieldsetAttrs, { onClick: this.onLabelClick }), label &&
-            h("legend", { key: '212e27fd8d20b31cf6d84078870ec59796bb59c6', class: "r-radio-group--label-container" }, h("r-label", { key: '69907b0e2bdb49bcdea00d1849bc0c5c4d3404ae', id: `${uniqueId}-label`, class: "r-radio-group--label", "field-indicator": fieldIndicator }, label), h("slot", { key: 'd208c147248154ba26ecc5b412233d2cf479bb68', name: "popover" })), hint &&
-            h("r-hint", { key: 'b409e053226d88ac3619524b2d63864b49972985', id: `${uniqueId}-hint`, class: "r-radio-group--hint", role: "note" }, hint), h("div", { key: 'c8e98214e9b14f6fdcf97677b392abd14d653a56', class: "r-radio-group--content" }, h("slot", { key: '5e4aa07801e8f1bd7ec3262511d28f553d8740a7' })), h("div", { key: 'a576e8c91d33877eb677d5551ac18d10924586fd', id: `${uniqueId}-message`, "aria-live": "polite", role: "alert", class: "r-radio-group--message" }, invalid && error &&
-            h("r-hint", { key: '98f7fa6855c0803ae5d31a3a248c146679204af9', variant: "error" }, error), this.validityState !== 'valid' && this.validityMessage &&
-            h("r-hint", { key: 'de1997af842a7e5fdb887a830fd0fe701e4fa5ce', variant: "error" }, this.customErrorMessage || this.validityMessage)))));
-    }
-    static get is() { return "r-radio-group"; }
-    static get encapsulation() { return "shadow"; }
-    static get originalStyleUrls() {
-        return {
-            "$": ["radio-group.css"]
-        };
-    }
-    static get styleUrls() {
-        return {
-            "$": ["radio-group.css"]
-        };
-    }
-    static get properties() {
-        return {
-            "form": {
-                "type": "string",
-                "attribute": "form",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Specifies the `id` of the `<form>` to which the element belongs"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": true
-            },
-            "name": {
-                "type": "string",
-                "attribute": "name",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Specifies common `name` property that is passed to each `r-radio-button`"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": true
-            },
-            "value": {
-                "type": "string",
-                "attribute": "value",
-                "mutable": true,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Displays currently selected value"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": true
-            },
-            "novalidate": {
-                "type": "boolean",
-                "attribute": "novalidate",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Specifies if element must be ignored during validation of the form elements"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false
-            },
-            "label": {
-                "type": "string",
-                "attribute": "label",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": true,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "The text of the label rendered before the set of radio-buttons"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false
-            },
-            "required": {
-                "type": "boolean",
-                "attribute": "required",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Specifies if radio-button within group must be checked"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false
-            },
-            "fieldIndicator": {
-                "type": "string",
-                "attribute": "field-indicator",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Define the marker text if the field label is marked\nField indicator can be Required*, Optional or a translation of those two options."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false
-            },
-            "valueMissingMessage": {
-                "type": "string",
-                "attribute": "value-missing-message",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Set custom message for `valueMissing` property of a ValidityState object (set by `required`) within Constrain Validation API"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false
-            },
-            "valid": {
-                "type": "boolean",
-                "attribute": "valid",
-                "mutable": true,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Apply validation success visual style"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": true
-            },
-            "invalid": {
-                "type": "boolean",
-                "attribute": "invalid",
-                "mutable": true,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Apply validation error visual style"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": true
-            },
-            "error": {
-                "type": "string",
-                "attribute": "error",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Custom validation error message"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false
-            },
-            "customErrorMessage": {
-                "type": "string",
-                "attribute": "custom-error-message",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Set custom message for `customError` property of a ValidityState object indicating whether the element's custom validity message has been set to a non-empty string by calling the element's setCustomValidity() method."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false
-            },
-            "hint": {
-                "type": "string",
-                "attribute": "hint",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Optional hint, visually presented under the group of radio-buttons\ngiving additional context to the user"
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false
-            },
-            "variant": {
-                "type": "string",
-                "attribute": "variant",
-                "mutable": false,
-                "complexType": {
-                    "original": "RadioGroupVariant",
-                    "resolved": "\"contained\" | \"standard\"",
-                    "references": {
-                        "RadioGroupVariant": {
-                            "location": "import",
-                            "path": "./exports",
-                            "id": "src/components/radio-group/exports.ts::RadioGroupVariant"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "Controls the style variation of the radio buttons."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": true,
-                "defaultValue": "'standard'"
-            },
-            "autofocus": {
-                "type": "boolean",
-                "attribute": "autofocus",
-                "mutable": false,
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": "When set to `true`, automatically focuses the first enabled radio button in the group on mount.\nThis will focus the selected radio button if one exists, or the first enabled radio button otherwise."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "defaultValue": "false"
-            },
-            "parentValue": {
-                "type": "string",
-                "attribute": "parent-value",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "For nested radio groups: specifies the parent radio button value that this nested group belongs to.\nWhen the parent group's value changes to a different value, this nested group will be automatically reset.\nThis ensures nested selections are only maintained when their parent context is active."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false
-            }
-        };
-    }
-    static get states() {
-        return {
-            "validityState": {},
-            "validityMessage": {}
-        };
-    }
-    static get events() {
-        return [{
-                "method": "rValidate",
-                "name": "rValidate",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Emits event after each validation"
-                },
-                "complexType": {
-                    "original": "{\n    state: string,\n    message: string\n  }",
-                    "resolved": "{ state: string; message: string; }",
-                    "references": {}
-                }
-            }, {
-                "method": "rChange",
-                "name": "rChange",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Emits `rChange` when component's value has been changed"
-                },
-                "complexType": {
-                    "original": "{\n    element: HTMLRRadioGroupElement,\n    value: any\n  }",
-                    "resolved": "{ element: HTMLRRadioGroupElement; value: any; }",
-                    "references": {
-                        "HTMLRRadioGroupElement": {
-                            "location": "global",
-                            "id": "global::HTMLRRadioGroupElement"
-                        }
-                    }
-                }
-            }, {
-                "method": "rReset",
-                "name": "rReset",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Emits `rReset` when component was reset to initial state by form reset"
-                },
-                "complexType": {
-                    "original": "{\n    element: HTMLRRadioGroupElement,\n    value: any\n  }",
-                    "resolved": "{ element: HTMLRRadioGroupElement; value: any; }",
-                    "references": {
-                        "HTMLRRadioGroupElement": {
-                            "location": "global",
-                            "id": "global::HTMLRRadioGroupElement"
-                        }
-                    }
-                }
-            }];
-    }
-    static get methods() {
-        return {
-            "resetValidity": {
-                "complexType": {
-                    "signature": "() => Promise<void>",
-                    "parameters": [],
-                    "references": {
-                        "Promise": {
-                            "location": "global",
-                            "id": "global::Promise"
-                        }
-                    },
-                    "return": "Promise<void>"
-                },
-                "docs": {
-                    "text": "Resets the validity state and message of the radio group.\nThis method clears the validity message and state, and sets the invalid\nproperty to its initial value.",
-                    "tags": []
-                }
-            },
-            "reset": {
-                "complexType": {
-                    "signature": "() => Promise<void>",
-                    "parameters": [],
-                    "references": {
-                        "Promise": {
-                            "location": "global",
-                            "id": "global::Promise"
-                        }
-                    },
-                    "return": "Promise<void>"
-                },
-                "docs": {
-                    "text": "Resets the radio group to its initial state.\n\nThis method:\n- clears the validity state and message, \n- sets the value and validity to initial values,\n- if no initial value the radio group will be deselected,\n- restores the tabindex on the first element.",
-                    "tags": []
-                }
-            },
-            "setValue": {
-                "complexType": {
-                    "signature": "(value: string | null) => Promise<void>",
-                    "parameters": [{
-                            "name": "value",
-                            "type": "string",
-                            "docs": "- The value to set for the radio group."
-                        }],
-                    "references": {
-                        "Promise": {
-                            "location": "global",
-                            "id": "global::Promise"
-                        }
-                    },
-                    "return": "Promise<void>"
-                },
-                "docs": {
-                    "text": "Sets the value of the radio group to the specified value.\nIf a radio button with the specified value exists, it will be selected.",
-                    "tags": [{
-                            "name": "param",
-                            "text": "value - The value to set for the radio group."
-                        }]
-                }
-            },
-            "getValue": {
-                "complexType": {
-                    "signature": "() => Promise<string | null>",
-                    "parameters": [],
-                    "references": {
-                        "Promise": {
-                            "location": "global",
-                            "id": "global::Promise"
-                        }
-                    },
-                    "return": "Promise<string>"
-                },
-                "docs": {
-                    "text": "Gets the current value of the radio group.",
-                    "tags": [{
-                            "name": "returns",
-                            "text": "The current value of the radio group."
-                        }]
-                }
-            },
-            "clearValue": {
-                "complexType": {
-                    "signature": "() => Promise<void>",
-                    "parameters": [],
-                    "references": {
-                        "Promise": {
-                            "location": "global",
-                            "id": "global::Promise"
-                        }
-                    },
-                    "return": "Promise<void>"
-                },
-                "docs": {
-                    "text": "Clears the value of the radio group and deselects all radio buttons.\nThis method sets the value to null and deselects all radio buttons in the group.",
-                    "tags": []
-                }
-            },
-            "checkValidity": {
-                "complexType": {
-                    "signature": "() => Promise<boolean>",
-                    "parameters": [],
-                    "references": {
-                        "Promise": {
-                            "location": "global",
-                            "id": "global::Promise"
-                        }
-                    },
-                    "return": "Promise<boolean>"
-                },
-                "docs": {
-                    "text": "Validates the radio group without triggering UI and returns a boolean indicating its validity.",
-                    "tags": [{
-                            "name": "returns",
-                            "text": "A boolean indicating whether the radio group is valid."
-                        }]
-                }
-            },
-            "reportValidity": {
-                "complexType": {
-                    "signature": "() => Promise<boolean>",
-                    "parameters": [],
-                    "references": {
-                        "Promise": {
-                            "location": "global",
-                            "id": "global::Promise"
-                        }
-                    },
-                    "return": "Promise<boolean>"
-                },
-                "docs": {
-                    "text": "Validates the radio group and displays the validity state.",
-                    "tags": []
-                }
-            },
-            "setCustomValidity": {
-                "complexType": {
-                    "signature": "(message: string) => Promise<void>",
-                    "parameters": [{
-                            "name": "message",
-                            "type": "string",
-                            "docs": "- The custom validity message to set."
-                        }],
-                    "references": {
-                        "Promise": {
-                            "location": "global",
-                            "id": "global::Promise"
-                        }
-                    },
-                    "return": "Promise<void>"
-                },
-                "docs": {
-                    "text": "Sets a custom validity message for the radio group.\nIf the message is not empty, the radio group will be considered invalid.",
-                    "tags": [{
-                            "name": "param",
-                            "text": "message - The custom validity message to set."
-                        }]
-                }
-            },
-            "setFocus": {
-                "complexType": {
-                    "signature": "() => Promise<void>",
-                    "parameters": [],
-                    "references": {
-                        "Promise": {
-                            "location": "global",
-                            "id": "global::Promise"
-                        }
-                    },
-                    "return": "Promise<void>"
-                },
-                "docs": {
-                    "text": "Sets focus on the radio button element.",
-                    "tags": []
-                }
-            },
-            "setBlur": {
-                "complexType": {
-                    "signature": "() => Promise<void>",
-                    "parameters": [],
-                    "references": {
-                        "Promise": {
-                            "location": "global",
-                            "id": "global::Promise"
-                        }
-                    },
-                    "return": "Promise<void>"
-                },
-                "docs": {
-                    "text": "Blurs the radio button element.",
-                    "tags": []
-                }
-            }
-        };
-    }
-    static get elementRef() { return "host"; }
-    static get listeners() {
-        return [{
-                "name": "rChange",
-                "method": "rChangeAction",
-                "target": undefined,
-                "capture": false,
-                "passive": false
-            }, {
-                "name": "radioButtonClick",
-                "method": "radioButtonClickAction",
-                "target": undefined,
-                "capture": false,
-                "passive": false
-            }, {
-                "name": "radioButtonKeydown",
-                "method": "radioButtonKeydownAction",
-                "target": undefined,
-                "capture": false,
-                "passive": false
-            }];
-    }
-}