Notification Header

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-notification-header é o subcomponente de cabeçalho do painel de notificações. Deve ser utilizado no slot correspondente do componente orquestrador <br-notification>.

Visão Geral

Subcomponente de cabeçalho da superfície br-notification, responsável pela identificação da área e controles de fechamento.

Papel na composição

• Exibe o título da central de notificações, avatar da pessoa autenticada e botão de ação para fechar o painel.
• Fornece contexto visual imediato ao abrir a gaveta de notificações.

Regra de uso e relacionamento

Deve ser utilizado como o elemento inicial dentro do orquestrador br-notification. Ele é coordenado pelo painel pai para disparar o evento de fechamento quando o botão de dispensa é acionado. Não deve ser usado fora de um br-notification.

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

Propriedades

closeLabel

Atributo	close-label
Descrição	Texto acessível do botão de fechar. Permite internacionalização.
Tipo	string
Valor padrão	'Fechar notificações'

customId

Atributo	custom-id
Descrição	Identificador único do componente. Quando omitido, um valor é gerado automaticamente. > Padrão: valor único gerado por generateUniqueId().
Tipo	string
Valor padrão	generateUniqueId()

label

Atributo	label
Descrição	Título textual do cabeçalho.
Tipo	string
Valor padrão	---

showCloseButton

Atributo	show-close-button
Descrição	Exibe botão de fechar dentro do cabeçalho.
Tipo	boolean
Valor padrão	true

subtitle

Atributo	subtitle
Descrição	Texto complementar, como e-mail ou identificação adicional do usuário.
Tipo	string
Valor padrão	---

Slots

Nome	Descrição
"actions"	Região para botão de fechar ou outras ações contextuais.
"avatar"	Área para avatar ou elemento visual do usuário.
"subtitle"	Conteúdo customizado do subtítulo.
"title"	Conteúdo customizado do título.

Eventos

Evento	Descrição	Depreciação	Propagação
brNotificationHeaderClose	Solicita o fechamento do painel a partir do cabeçalho.	---	true

Dependências

Componente pai

• br-notification

Depende de

• br-button
• br-icon

Gráfico