{{ t.pages.alerts.title }} {{ t.pages.alerts.subtitle }}

{{ t.pages.alerts.breadcrumb }}

{{ t.pages.alerts.intro }}

Descrição

O componente destaca estados rápidos, confirmações e avisos operacionais sem depender de JavaScript externo.

Recursos
  • Variantes cromáticas e ícones inline ou em bloco.
  • Modo sólido, pill, borderless e dismissible.
  • Customização por classes auxiliares.
Limitações
  • Alertas não substituem fluxos de confirmação crítica.
  • Mensagens longas pedem composição mais estruturada.
  • Estados simultâneos demais reduzem a hierarquia visual.
{{ t.pages.alerts.releaseDone }} {{ t.pages.alerts.releaseBody }} {{ t.pages.alerts.attention }} {{ t.pages.alerts.solidHelp }} {{ t.pages.alerts.borderlessHelp }} {{ t.pages.alerts.customHelp }}
{{ alertEventLog }}

Use alertas para mensagens curtas, estados operacionais e avisos de interface. O componente aceita configuração visual sem precisar de wrappers externos.

  • variant define a paleta do alerta.
  • iconClass, iconMode e iconPosition controlam a leitura visual.
  • [solid], [dismissible], [roundedPill] e [borderless] ajustam o acabamento.
  • (visibleChange) e (dismissed) sincronizam o estado com o componente pai.
  • alertClass, textClass e iconContainerClass refinam a aparência sem criar nova variante.
<li-alert
  variant="warning"
  [solid]="true"
  iconClass="ph-warning-circle"
  [dismissible]="true">
  <strong>Atenção.</strong> Revise a operação.
</li-alert>