Checkgroup

Componente mantido por compatibilidade; prefira a alternativa indicada na documentação.

Anatomia, uso, comportamento visual e recomendações conceituais são mantidos pelo Padrão Digital de Governo. Esta página documenta a implementação Web Components e sua API executável.

Exemplo(s)

O br-checkgroup está descontinuado e não recebe novos exemplos. Use o br-checkbox-group, que cobre os mesmos cenários (seleção padrão, marcada, parcial e desabilitada).

Propriedades

customId

Atributo	custom-id
Descrição	Identificador legado do controlador.
Tipo	string
Valor padrão	---

disabled

Atributo	disabled
Descrição	Desabilita o controlador e os checkboxes contidos no grupo.
Tipo	boolean
Valor padrão	false

indeterminate

Atributo	indeterminate
Descrição	Estado indeterminado inicial.
Tipo	boolean
Valor padrão	false

label

Atributo	label
Descrição	Texto descritivo do grupo.
Tipo	string
Valor padrão	---

labelDesselecionado Componente mantido por compatibilidade; prefira a alternativa indicada na documentação.

Atributo	label-desselecionado
Depreciação	Use selectAllLabel.
Descrição	Rótulo legado para marcar todos.
Tipo	string
Valor padrão	---

labelSelecionado Componente mantido por compatibilidade; prefira a alternativa indicada na documentação.

Atributo	label-selecionado
Depreciação	Use unselectAllLabel.
Descrição	Rótulo legado para desmarcar todos.
Tipo	string
Valor padrão	---

selectAllLabel

Atributo	select-all-label
Descrição	Rótulo para marcar todos.
Tipo	string
Valor padrão	---

unselectAllLabel

Atributo	unselect-all-label
Descrição	Rótulo para desmarcar todos.
Tipo	string
Valor padrão	---

Slots

Nome	Descrição
"default"	Slot para adicionar os checkboxes controlados pelo grupo.

[Descontinuado/Obsoleto] Use br-checkbox-group.

Eventos nativos

Elemento HTML de referência

A referência é <fieldset> com <legend> e vários <input type="checkbox">. br-checkgroup coordena br-checkbox; não equivale a um único controle HTML.

Como ouvir os eventos

const group = document.querySelector('br-checkgroup');

group.addEventListener('change', (event) => {
  console.log(event.target);
});

Eventos nativos suportados

Evento	Quando ocorre	Bubbles	Composed	Cancelable	Host	Observações
focusin / focusout	foco entra/sai de um filho	Sim	Sim	Não	Por delegação	Útil para observar o grupo.
input / change	checkbox filho alterna	Sim	Sim	Não	Por delegação	O alvo é o br-checkbox alterado, não o grupo.

Eventos não aplicáveis ou não suportados

Evento	Situação	Motivo	Alternativa
input/change com target no grupo	Não suportado	O grupo não é um controle de valor único.	Ouça por delegação e leia os filhos/FormData.
invalid do grupo	Não aplicável	Validade pertence a cada checkbox.	Consulte os controles requeridos.

Eventos customizados do componente

Os eventos de seleção em massa pertencem à coordenação do grupo e permanecem separados dos eventos nativos emitidos por cada checkbox.

Valor e estado após o evento

Leia checked, value e name nos checkboxes filhos ou serialize o formulário com FormData.

Frameworks

Em HTML, React, Angular e Vue, ouça os filhos ou delegue no grupo. Não trate o host como um HTMLInputElement único.

Acessibilidade

O rótulo do conjunto deve nomear o agrupamento; navegação e Space continuam pertencendo a cada checkbox.

Evidência de teste

_tests/checkgroup.e2e.tsx cobre coordenação, múltiplas instâncias e seleção em Chromium headless. Flags e caminho dos eventos delegados permanecem pendentes.

Dependências

Depende de

• br-checkbox-group

Gráfico