Skip Link Item

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-skip-link-item é o subcomponente que representa um atalho de salto de acessibilidade individual. Deve ser declarado dentro do componente principal <br-skip-link>.

Visão Geral

Subcomponente individual de br-skip-link, utilizado para declarar cada atalho específico de salto de bloco acessível.

Papel na composição

• Define o texto descritivo do atalho (ex.: "Ir para o conteúdo") e o identificador do alvo na página (targetId ou href).
• Transfere o foco programático e visual diretamente para o elemento alvo ao ser acionado com Enter ou espaço.

Regra de uso e relacionamento

Deve ser declarado no slot padrão do orquestrador br-skip-link. Cada item deve apontar para um elemento existente na página dotado de id e foco acessível (tabindex="-1"). Não deve ser usado fora do contexto do skip-link.

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

Propriedades

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()

hideTag

Atributo	hide-tag
Descrição	Controla a visibilidade da tag numérica. Quando true, a tag numérica não será exibida, mesmo que keyNumber esteja definido. O atalho de teclado continua funcionando, apenas a indicação visual é ocultada.
Tipo	boolean
Valor padrão	false

keyNumber

Atributo	key-number
Descrição	Número da tecla para acesso rápido. Permite que o usuário ative este item pressionando Alt+[keyNumber]. Aceita valores de 1 a 9. Esta propriedade implementa uma alternativa ao accessKey nativa, fornecendo um atalho de teclado consistente e acessível. Valores inválidos são ignorados.
Tipo	number
Valor padrão	---

target

Atributo	target
Descrição	ID do elemento de destino ou seletor CSS. Este é o elemento para o qual o usuário será levado ao ativar este item. (obrigatório)
Tipo	string
Valor padrão	---

Slots

Nome	Descrição
"default"	Slot para o texto do link de navegação rápida.
"tag"	Slot para personalizar a tag numérica do atalho de teclado, exibindo o valor de key-number por padrão.

Eventos

Evento	Descrição	Depreciação	Propagação
brSkipLinkItemActivate	Evento canônico emitido quando o item é ativado.	---	true
brSkiplinkItemClick Componente mantido por compatibilidade; prefira a alternativa indicada na documentação.		Use brSkipLinkItemActivate.	true
brSkipLinkItemFocus	Evento canônico emitido quando o item recebe foco.	---	true
brSkiplinkItemFocus Componente mantido por compatibilidade; prefira a alternativa indicada na documentação.		Use brSkipLinkItemFocus.	true

Métodos

itemFocus

Descrição	Move o foco para este item.
Assinatura	itemFocus() => Promise<void>
Parâmetros	---

navigateToTarget

Descrição	Navega para o target definido. Move o foco para o elemento alvo e ajusta a rolagem da página se necessário.
Assinatura	navigateToTarget() => Promise<void>
Parâmetros	---

[Descontinuado/Obsoleto] Use br-skip-link-item.

Dependências

Componente pai

• br-skip-link

Usado por

• br-skip-link-item

Depende de

• br-item
• br-tag

Gráfico