Copiar página como Markdown para IA
Footer Social
Subcomponente de Composição
O br-footer-social agrupa links e ícones para as redes sociais oficiais no rodapé. Deve ser posicionado no slot ou área de mídias sociais do componente orquestrador <br-footer>.
Visão Geral
Link para uma rede social no br-footer. Use no slot social-network.
Informe em icon o nome do ícone de marca, como instagram ou youtube; em description, o nome da rede (usado como texto acessível); e em href, o endereço. Para outro ícone, use o slot icon.
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() |
description
| Atributo | description |
|---|---|
| Descrição | Descrição do ícone da rede social |
| Tipo | string |
| Valor padrão | --- |
href
| Atributo | href |
|---|---|
| Descrição | URL da rede social |
| Tipo | string |
| Valor padrão | --- |
icon
| Atributo | icon |
|---|---|
| Descrição | Nome do ícone Font Awesome 5 Free presente no cache local, sem o prefixofa-brands: (ex.: instagram). Use o slot icon para conteúdo próprio. |
| Tipo | string |
| Valor padrão | --- |
navigationMode
| Atributo | navigation-mode |
|---|---|
| Descrição | Controla como o componente integra a navegação mantendo href real no elemento navegável.- native (padrão): preserva o comportamento do navegador, conforme HTML/W3C.- event: emite brNavigate; se o evento for cancelado, bloqueia a navegação nativa para a SPA assumir.Cliques com modificadores, botão do meio ou target diferente de _self permanecem nativos. |
| Tipo | "event" | "native" |
| Valor padrão | 'native' |
target
| Atributo | target |
|---|---|
| Descrição | Target do link quando href é fornecido. |
| Tipo | "_blank" | "_parent" | "_self" | "_top" |
| Valor padrão | '_self' |
Slots
| Nome | Descrição |
|---|---|
"icon" | Ícone personalizado. Quando preenchido, substitui o ícone definido por icon. |
Eventos
| Evento | Descrição | Depreciação | Propagação |
|---|---|---|---|
brNavigate | Evento cancelável emitido em navigation-mode="event" para cliques primários sem modificadores em links _self. Chame event.preventDefault() no listener para impedir a navegação nativa e entregar event.detail.href ao roteador da SPA. | --- | true |
Migração da navegação
Troque is-spa-link-behavior por navigation-mode="event" e trate brNavigate. Para redes sociais externas ou com target="_blank", mantenha a navegação normal.
<!-- Antes -->
<br-footer-social href="/instagram" icon="instagram" description="Instagram" is-spa-link-behavior></br-footer-social>
<!-- Agora -->
<br-footer-social href="/instagram" icon="instagram" description="Instagram" navigation-mode="event"></br-footer-social>
