Table Header Cell

Componente estável e recomendada para novos projetos.

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.

Subcomponente de Composição

O br-table-header-cell representa uma célula de cabeçalho (<th>) com suporte a ordenação. Deve ser utilizado dentro de um <br-table-row> no <br-table-header>.

Visão Geral

Subcomponente de célula de cabeçalho de br-table, responsável por nomear uma coluna e oferecer controles opcionais de ordenação.

Papel na composição

• Define o rótulo da coluna com role="columnheader".
• Suporta gatilho interativo de ordenação crescente e decrescente (sortable), emitindo eventos para reordenação de dados.

Regra de uso e relacionamento

Deve ser declarado dentro de um br-table-row situado no br-table-header. O alinhamento horizontal segue a definição da coluna na tabela pai.

Para a documentação completa de design, consulte o Design System do GovBR.

Exemplo(s)

Propriedades

columnWidth

Atributo	column-width
Descrição	Define a largura da coluna. Aceita fill, content, larguras positivas em px ou frações positivas em fr. Valores inválidos usam o fallback da tabela.
Exemplo de uso	<br-table-header-cell column-width="2fr">Descrição</br-table-header-cell>
Tipo	"content" | "fill" | `${number}fr` | `${number}px`
Valor padrão	---

horizontalAlignment

Atributo	horizontal-alignment
Descrição	Define o alinhamento horizontal do conteúdo dentro da célula de cabeçalho, permitindo a herança de alinhamento para as células filhas com base no valor definido.
Tipo	"center" | "end" | "start"
Valor padrão	---

overflow

Atributo	overflow
Descrição	Define se o conteúdo dentro da célula de cabeçalho deve ser truncado, permitindo a herança dessa configuração para as células filhas com base no valor definido.
Tipo	"truncate" | "wrap"
Valor padrão	---

tooltipMode

Atributo	tooltip-mode
Descrição	Define o modo de resolução do tooltip nesta coluna/célula de cabeçalho.
Tipo	"disabled" | "enabled" | "inherit"
Valor padrão	---

tooltipState

Atributo	tooltip-state
Descrição	Define o estado semântico do tooltip nesta coluna/célula de cabeçalho.
Tipo	"danger" | "info" | "success" | "warning"
Valor padrão	---

verticalAlignment

Atributo	vertical-alignment
Descrição	Define o alinhamento vertical do conteúdo dentro da célula de cabeçalho, permitindo a herança de alinhamento para as células filhas com base no valor definido.
Tipo	"center" | "end" | "start"
Valor padrão	---

Eventos

Evento	Descrição	Depreciação	Propagação
brAlignmentChange	Evento customizado emitido quando o alinhamento é alterado, permitindo que a célula de cabeçalho reaja dinamicamente a mudanças nos tokens de alinhamento.	---	true
brColumnWidthChange	Evento customizado emitido quando a largura da coluna é alterada, permitindo que as células reajam dinamicamente a mudanças no layout.	---	true
brOverflowChange	Evento customizado emitido quando a configuração de overflow é alterada, permitindo que a célula de cabeçalho reaja dinamicamente a mudanças no token de overflow.	---	true

CSS Shadow Parts

Nome	Descrição
"cell"	Wrapper da célula de cabeçalho.
"content"	Área de conteúdo da célula de cabeçalho.

Dependências

Componente pai

• br-table

Depende de

• br-tooltip

Gráfico