@govbr-ds/webcomponents 2.1.0 → 2.1.1

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

@@ -0,0 +1,847 @@
+/*!
+ * Construído por SERPRO
+ * © https://serpro.gov.br/ - MIT License.
+ */
+import { Host, h, } from "@stencil/core";
+import { dispatchNativeFormEvent, redispatchNativeFormEvent } from "../../shared/utils/event";
+import { getCheckableFormValue, getCheckableRestoreState, getFormValidationState, isFormControlDisabled, safeSetFormValue, setFormValidity, } from "../../shared/utils/form";
+import { generateUniqueId } from "../../shared/utils/id";
+import { hasAssignedSlotContent } from "../../shared/utils/slot";
+import { resolveFormValidator, runFormValidator } from "../../shared/utils/validator";
+/**
+ * ## Design System
+ *
+ * Para a documentação completa de design, incluindo diretrizes de uso, acessibilidade e exemplos visuais, consulte o [Design System do GovBR](https://www.gov.br/ds/components/radio?tab=designer).
+ *
+ * @category Formulários
+ * @status stable
+ * @slot default - Slot para o rótulo do rádio, como alternativa à propriedade label.
+ * @slot feedback - Mensagem de validação, normalmente um `br-message`.
+ *
+ * @part container - Contêiner visual do radio.
+ * @part radio-input - Elemento input nativo do radio.
+ * @part radio-label - Rótulo do radio.
+ * @part feedback - Contêiner da mensagem de validação.
+ */
+export class Radio {
+    constructor() {
+        this.formDisabled = false;
+        this.updateTrigger = 0;
+        /** Indica se o slot de feedback possui conteúdo fornecido pelo consumidor. */
+        this.hasFeedbackSlot = false;
+        /** Mensagem definida pela Constraint Validation API. */
+        this.customValidationMessage = '';
+        this.validatorMessage = null;
+        this.isValidating = false;
+        this.groupManaged = false;
+        this.groupDisabled = false;
+        this.groupTabIndex = -1;
+        /**
+         * Define o estado de seleção do radio.
+         * Se definido como verdadeiro, o radio estará marcado. Caso contrário, estará desmarcado.
+         */
+        this.checked = false;
+        /**
+         * Permite desmarcar o radio ao clicar duas vezes sobre ele.
+         * Por padrão, um radio selecionado permanece marcado ao receber um segundo clique.
+         */
+        this.uncheckOnDoubleClick = false;
+        /**
+         * Desativa o radio, tornando-o não interativo.
+         */
+        this.disabled = false;
+        /**
+         * Se verdadeiro, o radio é obrigatório e uma opção deve ser selecionada antes que o formulário possa ser enviado.
+         */
+        this.required = false;
+        /**
+         * Define se o label associado ao radio deve ser oculto.
+         * Se definido como verdadeiro, o texto do label será oculto, mas o radio ainda estará visível e funcional.
+         * @deprecated Use `labelHidden`.
+         */
+        this.hasHiddenLabel = false;
+        /**
+         * Identificador único; gerado automaticamente quando omitido.
+         */
+        this.customId = generateUniqueId();
+        this.validationRunId = 0;
+        this.initialChecked = false;
+        /**
+         * Handler para o event `click`
+         * @param event Objeto Event
+         */
+        this.onClick = () => {
+            if (this.isDisabled()) {
+                return;
+            }
+        };
+        this.onInput = (event) => {
+            this.checked = event.target.checked;
+            this.checkedChange.emit(this.checked);
+            redispatchNativeFormEvent(this.el, event, 'input');
+        };
+        /**
+         * Handler para o evento `change`
+         */
+        this.onChange = (event) => {
+            redispatchNativeFormEvent(this.el, event, 'change');
+            if (!this.isManagedByGroup())
+                void this.validate();
+        };
+    }
+    formDisabledCallback(disabled) {
+        this.formDisabled = disabled;
+    }
+    formResetCallback() {
+        this.customValidationMessage = '';
+        this.validatorMessage = null;
+        this.validationRunId++;
+        if (this.isManagedByGroup()) {
+            this.syncFormState();
+            return;
+        }
+        this.checked = this.initialChecked;
+        this.syncFormState();
+    }
+    formStateRestoreCallback(state) {
+        if (this.isManagedByGroup()) {
+            this.syncFormState();
+            return;
+        }
+        this.checked = state === 'checked';
+        this.syncFormState();
+    }
+    checkedChanged() {
+        this.syncFormState();
+        if (this.isManagedByGroup()) {
+            this.el.dispatchEvent(new CustomEvent('brInternalRadioChecked', {
+                bubbles: true,
+                composed: true,
+            }));
+            return;
+        }
+        const root = this.el.getRootNode();
+        if (this.checked) {
+            root.querySelectorAll('br-radio').forEach((radio) => {
+                if (radio !== this.el && this.isStandalonePeer(radio) && radio.name === this.name && radio.checked)
+                    radio.checked = false;
+            });
+        }
+        requestAnimationFrame(() => this.syncGroupTabStops());
+    }
+    handleRadioGroupState(event) {
+        if (event.target !== this.el)
+            return;
+        this.groupManaged = event.detail.managed;
+        this.groupDisabled = event.detail.disabled;
+        this.groupTabIndex = event.detail.tabIndex;
+        this.syncFormState();
+    }
+    componentWillLoad() {
+        this.initialChecked = this.checked;
+        this.syncFormState();
+    }
+    componentDidLoad() {
+        this.hasFeedbackSlot = this.el.querySelector('[slot="feedback"]') !== null;
+        this.updateValidity();
+    }
+    componentDidUpdate() {
+        this.updateValidity();
+    }
+    /**
+     * Mantém o protocolo legado de sincronização por `checkedChange`.
+     * @deprecated A coordenação interna agora é limitada à raiz DOM do grupo.
+     */
+    handleCheckedChange(event) {
+        const radio = event.target;
+        if (radio.customId === this.customId || radio.name !== this.name || !event.detail)
+            return;
+        if (this.checked)
+            this.checked = false;
+        this.updateTrigger++;
+    }
+    /**
+     * Navega e seleciona o próximo/anterior rádio habilitado no grupo via teclas de seta.
+     * Ativado por 'keydown', move a seleção entre rádios do mesmo 'name'
+     * usando as setas, partindo do rádio atualmente checado.
+     * @param {KeyboardEvent} event O evento de teclado.
+     * @listens keydown
+     */
+    handleKeyDown(event) {
+        if (this.isDisabled() || this.isManagedByGroup())
+            return;
+        const navigationKeys = ['ArrowRight', 'ArrowDown', 'ArrowLeft', 'ArrowUp', 'Home', 'End'];
+        if (!navigationKeys.includes(event.key))
+            return;
+        // Prevent default scrolling
+        event.preventDefault();
+        const root = this.el.getRootNode();
+        const radios = Array.from(root.querySelectorAll('br-radio')).filter((el) => this.isStandalonePeer(el) && el.name === this.name && !el.disabled);
+        const currentIndex = radios.indexOf(this.el);
+        if (currentIndex === -1)
+            return;
+        let nextIndex = currentIndex;
+        if (event.key === 'ArrowRight' || event.key === 'ArrowDown') {
+            nextIndex = (currentIndex + 1) % radios.length;
+        }
+        else if (event.key === 'ArrowLeft' || event.key === 'ArrowUp') {
+            nextIndex = (currentIndex - 1 + radios.length) % radios.length;
+        }
+        else if (event.key === 'Home') {
+            nextIndex = 0;
+        }
+        else if (event.key === 'End') {
+            nextIndex = radios.length - 1;
+        }
+        const nextRadio = radios[nextIndex];
+        if (nextRadio) {
+            if (!nextRadio.checked) {
+                nextRadio.toggleChecked();
+            }
+            nextRadio.setFocus();
+        }
+    }
+    /**
+     * Retorna `true` se o valor do radio for válido, caso contrário `false`.
+     * Se o radio for inválido, dispara um evento 'invalid'.
+     */
+    async checkValidity() {
+        return this.elementInternals?.checkValidity?.() ?? true;
+    }
+    /**
+     * Retorna `true` se o valor do radio for válido, caso contrário `false`.
+     * Se for inválido, exibe a mensagem de erro padrão do navegador.
+     */
+    async reportValidity() {
+        return this.elementInternals?.reportValidity?.() ?? true;
+    }
+    /**
+     * Define uma mensagem de validação customizada para o radio.
+     * Se a mensagem for uma string vazia, o erro customizado é limpo.
+     */
+    async setCustomValidity(message) {
+        this.customValidationMessage = message;
+        this.updateValidity();
+    }
+    /** Executa o validator do radio e retorna se o valor atual é válido. */
+    async validate() {
+        const validator = resolveFormValidator(this.validator);
+        if (!validator || this.isDisabled())
+            return this.checkValidity();
+        const runId = ++this.validationRunId;
+        this.isValidating = true;
+        this.validatorMessage = null;
+        this.updateValidity();
+        this.brRadioValidationChange.emit({ validating: true, valid: null, message: null });
+        const message = await runFormValidator(validator, this.checked);
+        if (runId !== this.validationRunId)
+            return false;
+        this.validatorMessage = message;
+        this.isValidating = false;
+        this.updateValidity();
+        const valid = message === null && (await this.checkValidity());
+        this.brRadioValidationChange.emit({ validating: false, valid, message });
+        return valid;
+    }
+    /** Retorna um snapshot serializável da Constraint Validation API. */
+    async getValidationState() {
+        return getFormValidationState(this.elementInternals);
+    }
+    /**
+     * Inverte o valor da prop `checked`
+     * @deprecated Atualize a propriedade `checked` diretamente.
+     */
+    async toggleChecked() {
+        if (this.isDisabled()) {
+            return;
+        }
+        this.checked = !this.checked;
+    }
+    /**
+     * Move o foco para o input radio nativo interno.
+     */
+    async setFocus() {
+        const input = this.el.shadowRoot?.querySelector('input');
+        if (input) {
+            input.focus();
+        }
+    }
+    syncFormState() {
+        safeSetFormValue(this.elementInternals, this.isManagedByGroup() ? null : getCheckableFormValue(this.checked, this.value), getCheckableRestoreState(this.checked));
+        this.updateValidity();
+    }
+    isDisabled() {
+        return isFormControlDisabled(this.disabled || this.groupDisabled, this.formDisabled);
+    }
+    isManagedByGroup() {
+        return this.groupManaged;
+    }
+    isStandalonePeer(radio) {
+        return radio.parentElement?.tagName.toLowerCase() !== 'br-radio-group';
+    }
+    updateValidity() {
+        if (this.isManagedByGroup()) {
+            setFormValidity(this.elementInternals, {}, '', this.nativeInput);
+            this.nativeInput?.removeAttribute('aria-invalid');
+            return;
+        }
+        const root = this.el.getRootNode();
+        const group = Array.from(root.querySelectorAll('br-radio')).filter((radio) => this.isStandalonePeer(radio) && radio.name === this.name && !radio.disabled);
+        const valueMissing = group.some((radio) => radio.required) && !group.some((radio) => radio.checked);
+        setFormValidity(this.elementInternals, { customError: this.customValidationMessage !== '' || Boolean(this.validatorMessage), valueMissing }, this.customValidationMessage || this.validatorMessage || (valueMissing ? 'Selecione uma opção.' : ''), this.nativeInput);
+    }
+    getCssClassMap() {
+        return {
+            'br-radio': true,
+            valid: (this.feedbackState ?? this.state) === 'valid',
+            invalid: (this.feedbackState ?? this.state) === 'invalid' || Boolean(this.customValidationMessage),
+            disabled: this.isDisabled(),
+            'hidden-label': this.labelHidden ?? this.hasHiddenLabel,
+        };
+    }
+    handleDoubleClick() {
+        if (this.isDisabled() || !this.uncheckOnDoubleClick || !this.checked)
+            return;
+        this.checked = false;
+        this.checkedChange.emit(false);
+        dispatchNativeFormEvent(this.el, 'input');
+        dispatchNativeFormEvent(this.el, 'change');
+    }
+    computeTabIndex() {
+        if (this.isDisabled())
+            return -1;
+        if (this.checked)
+            return 0;
+        if (this.isManagedByGroup()) {
+            return this.groupTabIndex;
+        }
+        // If unchecked, we are only focusable (0) if NO sibling is checked AND we are the first enabled sibling.
+        const root = this.el.getRootNode();
+        if (!root)
+            return 0; // Fallback
+        const radios = Array.from(root.querySelectorAll('br-radio')).filter((r) => this.isStandalonePeer(r) && r.name === this.name && !r.disabled);
+        const anyChecked = radios.some((r) => r.checked);
+        if (anyChecked)
+            return -1;
+        return radios[0] === this.el ? 0 : -1;
+    }
+    syncGroupTabStops() {
+        if (this.isManagedByGroup())
+            return;
+        const root = this.el.getRootNode();
+        const radios = Array.from(root.querySelectorAll('br-radio')).filter((radio) => this.isStandalonePeer(radio) && radio.name === this.name && !radio.disabled);
+        const checked = radios.find((radio) => radio.checked);
+        radios.forEach((radio, index) => {
+            const input = radio.shadowRoot?.querySelector('input');
+            if (input)
+                input.tabIndex = checked ? (radio === checked ? 0 : -1) : index === 0 ? 0 : -1;
+        });
+    }
+    render() {
+        return (h(Host, { key: '901d104850affc37fd4a3fb6e10555df2ff3a3a2', "aria-disabled": this.isDisabled() ? 'true' : null }, h("div", { key: '0cec7b8788aeaf14c5664a118b1b08ba9f98d554', class: this.getCssClassMap(), part: "container" }, h("input", { key: 'b482525d1c53bbd1b2aaa26a555b4b504fe145ff', part: "radio-input", ref: (el) => (this.nativeInput = el), "aria-label": (this.labelHidden ?? this.hasHiddenLabel) && this.label ? this.label : null, type: "radio", id: this.customId, name: this.name, checked: this.checked, disabled: this.isDisabled(), required: false, value: this.value, tabIndex: this.computeTabIndex(), onClick: this.onClick, onInput: this.onInput, onChange: this.onChange, "aria-busy": this.isValidating ? 'true' : null, "aria-describedby": this.hasFeedbackSlot || this.customValidationMessage || this.validatorMessage
+                ? `${this.customId}-feedback`
+                : null, "aria-errormessage": this.customValidationMessage || this.validatorMessage || this.hasFeedbackSlot
+                ? `${this.customId}-feedback`
+                : null }), h("label", { key: '4fad61240eb20ad86a7f5abc5fec2dc5fcc07fc9', part: "radio-label", htmlFor: this.customId }, h("slot", { key: '70621e149e42c76dd5d7f2e52940ad29aca01a48' }, this.label))), h("div", { key: 'd69344eccd5d181bd3d5e21fba64df01be3f8ca6', id: `${this.customId}-feedback`, part: "feedback", hidden: !this.hasFeedbackSlot && !this.customValidationMessage && !this.validatorMessage }, h("slot", { key: '806b849d33bff7980db0ddc78a1ceed969b99dfe', name: "feedback", onSlotchange: (event) => (this.hasFeedbackSlot = hasAssignedSlotContent(event.currentTarget)) }), !this.hasFeedbackSlot && (this.customValidationMessage || this.validatorMessage) ? (h("br-message", { state: "danger", message: this.customValidationMessage || this.validatorMessage })) : null)));
+    }
+    static get is() { return "br-radio"; }
+    static get encapsulation() { return "shadow"; }
+    static get delegatesFocus() { return true; }
+    static get formAssociated() { return true; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["radio.scss"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["radio.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "checked": {
+                "type": "boolean",
+                "mutable": true,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Define o estado de sele\u00E7\u00E3o do radio.\nSe definido como verdadeiro, o radio estar\u00E1 marcado. Caso contr\u00E1rio, estar\u00E1 desmarcado."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": true,
+                "attribute": "checked",
+                "defaultValue": "false"
+            },
+            "uncheckOnDoubleClick": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Permite desmarcar o radio ao clicar duas vezes sobre ele.\nPor padr\u00E3o, um radio selecionado permanece marcado ao receber um segundo clique."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": true,
+                "attribute": "uncheck-on-double-click",
+                "defaultValue": "false"
+            },
+            "disabled": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Desativa o radio, tornando-o n\u00E3o interativo."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": true,
+                "attribute": "disabled",
+                "defaultValue": "false"
+            },
+            "required": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Se verdadeiro, o radio \u00E9 obrigat\u00F3rio e uma op\u00E7\u00E3o deve ser selecionada antes que o formul\u00E1rio possa ser enviado."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": true,
+                "attribute": "required",
+                "defaultValue": "false"
+            },
+            "validator": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "RadioValidator",
+                    "resolved": "(value: boolean) => string | Promise<string>",
+                    "references": {
+                        "RadioValidator": {
+                            "location": "import",
+                            "path": "./radio.types",
+                            "id": "src/components/radio/radio.types.ts::RadioValidator",
+                            "referenceLocation": "RadioValidator"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Regra s\u00EDncrona ou ass\u00EDncrona aplicada ao estado booleano do radio."
+                },
+                "getter": false,
+                "setter": false
+            },
+            "state": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'valid' | 'invalid'",
+                    "resolved": "\"invalid\" | \"valid\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Indica a validade do radio.\nSe n\u00E3o for especificado, o valor padr\u00E3o \u00E9 `null`, indicando que a validade n\u00E3o foi definida."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": true,
+                "attribute": "state"
+            },
+            "feedbackState": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "'valid' | 'invalid'",
+                    "resolved": "\"invalid\" | \"valid\"",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Estado de feedback can\u00F4nico. Quando informado, tem preced\u00EAncia sobre `state`."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": true,
+                "attribute": "feedback-state"
+            },
+            "hasHiddenLabel": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "deprecated",
+                            "text": "Use `labelHidden`."
+                        }],
+                    "text": "Define se o label associado ao radio deve ser oculto.\nSe definido como verdadeiro, o texto do label ser\u00E1 oculto, mas o radio ainda estar\u00E1 vis\u00EDvel e funcional."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": true,
+                "attribute": "has-hidden-label",
+                "defaultValue": "false"
+            },
+            "labelHidden": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Oculta visualmente o r\u00F3tulo. Quando informada, tem preced\u00EAncia sobre `hasHiddenLabel`."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": true,
+                "attribute": "label-hidden"
+            },
+            "customId": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Identificador \u00FAnico; gerado automaticamente quando omitido."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": true,
+                "attribute": "custom-id",
+                "defaultValue": "generateUniqueId()"
+            },
+            "name": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": true,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Define o nome do radio, que \u00E9 utilizado para agrupar radios em formul\u00E1rios e identificar o campo.\nO valor \u00E9 obrigat\u00F3rio e deve ser fornecido para garantir o correto funcionamento em formul\u00E1rios."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": true,
+                "attribute": "name"
+            },
+            "label": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Texto descritivo exibido \u00E0 direita do radio.\nCaso um slot seja utilizado para fornecer um texto alternativo, o valor desta propriedade ser\u00E1 ignorado."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": true,
+                "attribute": "label"
+            },
+            "value": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "Define o valor associado ao radio quando ele faz parte de um formul\u00E1rio nativo (`<form>`).\nEsse valor \u00E9 enviado com o formul\u00E1rio quando o radio est\u00E1 selecionado.\n**Nota:** Esta propriedade n\u00E3o deve ser utilizada para determinar se o radio est\u00E1 selecionado; para verificar o estado de sele\u00E7\u00E3o, use a propriedade `checked`."
+                },
+                "getter": false,
+                "setter": false,
+                "reflect": true,
+                "attribute": "value"
+            }
+        };
+    }
+    static get states() {
+        return {
+            "formDisabled": {},
+            "updateTrigger": {},
+            "hasFeedbackSlot": {},
+            "customValidationMessage": {},
+            "validatorMessage": {},
+            "isValidating": {},
+            "groupManaged": {},
+            "groupDisabled": {},
+            "groupTabIndex": {}
+        };
+    }
+    static get events() {
+        return [{
+                "method": "checkedChange",
+                "name": "checkedChange",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [{
+                            "name": "deprecated",
+                            "text": "Use `input`/`change` e leia `event.target.checked`."
+                        }],
+                    "text": "Disparado depois que o valor do `checked` foi alterado."
+                },
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                }
+            }, {
+                "method": "brRadioValidationChange",
+                "name": "brRadioValidationChange",
+                "bubbles": true,
+                "cancelable": true,
+                "composed": true,
+                "docs": {
+                    "tags": [],
+                    "text": "Emitido ao iniciar e concluir a valida\u00E7\u00E3o customizada."
+                },
+                "complexType": {
+                    "original": "FormValidationChangeDetail",
+                    "resolved": "FormValidationChangeDetail",
+                    "references": {
+                        "FormValidationChangeDetail": {
+                            "location": "import",
+                            "path": "../../shared/utils/validator",
+                            "id": "src/shared/utils/validator.ts::FormValidationChangeDetail",
+                            "referenceLocation": "FormValidationChangeDetail"
+                        }
+                    }
+                }
+            }];
+    }
+    static get methods() {
+        return {
+            "checkValidity": {
+                "complexType": {
+                    "signature": "() => Promise<boolean>",
+                    "parameters": [],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<boolean>"
+                },
+                "docs": {
+                    "text": "Retorna `true` se o valor do radio for v\u00E1lido, caso contr\u00E1rio `false`.\nSe o radio for inv\u00E1lido, dispara um evento 'invalid'.",
+                    "tags": []
+                }
+            },
+            "reportValidity": {
+                "complexType": {
+                    "signature": "() => Promise<boolean>",
+                    "parameters": [],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<boolean>"
+                },
+                "docs": {
+                    "text": "Retorna `true` se o valor do radio for v\u00E1lido, caso contr\u00E1rio `false`.\nSe for inv\u00E1lido, exibe a mensagem de erro padr\u00E3o do navegador.",
+                    "tags": []
+                }
+            },
+            "setCustomValidity": {
+                "complexType": {
+                    "signature": "(message: string) => Promise<void>",
+                    "parameters": [{
+                            "name": "message",
+                            "type": "string",
+                            "docs": ""
+                        }],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<void>"
+                },
+                "docs": {
+                    "text": "Define uma mensagem de valida\u00E7\u00E3o customizada para o radio.\nSe a mensagem for uma string vazia, o erro customizado \u00E9 limpo.",
+                    "tags": []
+                }
+            },
+            "validate": {
+                "complexType": {
+                    "signature": "() => Promise<boolean>",
+                    "parameters": [],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<boolean>"
+                },
+                "docs": {
+                    "text": "Executa o validator do radio e retorna se o valor atual \u00E9 v\u00E1lido.",
+                    "tags": []
+                }
+            },
+            "getValidationState": {
+                "complexType": {
+                    "signature": "() => Promise<FormValidationState>",
+                    "parameters": [],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        },
+                        "FormValidationState": {
+                            "location": "import",
+                            "path": "../../shared/utils/form",
+                            "id": "src/shared/utils/form.ts::FormValidationState",
+                            "referenceLocation": "FormValidationState"
+                        }
+                    },
+                    "return": "Promise<FormValidationState>"
+                },
+                "docs": {
+                    "text": "Retorna um snapshot serializ\u00E1vel da Constraint Validation API.",
+                    "tags": []
+                }
+            },
+            "toggleChecked": {
+                "complexType": {
+                    "signature": "() => Promise<void>",
+                    "parameters": [],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<void>"
+                },
+                "docs": {
+                    "text": "Inverte o valor da prop `checked`",
+                    "tags": [{
+                            "name": "deprecated",
+                            "text": "Atualize a propriedade `checked` diretamente."
+                        }]
+                }
+            },
+            "setFocus": {
+                "complexType": {
+                    "signature": "() => Promise<void>",
+                    "parameters": [],
+                    "references": {
+                        "Promise": {
+                            "location": "global",
+                            "id": "global::Promise"
+                        }
+                    },
+                    "return": "Promise<void>"
+                },
+                "docs": {
+                    "text": "Move o foco para o input radio nativo interno.",
+                    "tags": []
+                }
+            }
+        };
+    }
+    static get elementRef() { return "el"; }
+    static get watchers() {
+        return [{
+                "propName": "checked",
+                "methodName": "checkedChanged"
+            }];
+    }
+    static get listeners() {
+        return [{
+                "name": "brRadioGroupState",
+                "method": "handleRadioGroupState",
+                "target": undefined,
+                "capture": false,
+                "passive": false
+            }, {
+                "name": "keydown",
+                "method": "handleKeyDown",
+                "target": undefined,
+                "capture": false,
+                "passive": false
+            }, {
+                "name": "dblclick",
+                "method": "handleDoubleClick",
+                "target": undefined,
+                "capture": false,
+                "passive": false
+            }];
+    }
+    static get attachInternalsMemberName() { return "elementInternals"; }
+}