DropdownMenu

Menu de ações disparado por clique (Nuxt UI) — o "mais ações" (kebab) de cada linha.

Componente base do Nuxt UI (UDropdownMenu), ainda não internalizado no EletroDS — confira o comportamento antes de usar no ME.

O DropdownMenu é o menu de ações aberto por clique. Na index, é o menu de mais ações por linha (gatilho ellipsis-vertical); também é o menu Opções da ButtonBar e o menu de interação de uma entidade (clicar no nome de um Fornecedor, Comprador ou Responsável abre Ver detalhes · Enviar para o Genius · Enviar mensagem).

Uso em tela

Itens com ícone + rótulo, separadores por grupo e a ação destrutiva isolada ao fim (após divisor). Convenção do ME: ellipsis-vertical = menu individual da linha; ellipsis (horizontal) = "Mais ações" da tela — não troque um pelo outro. O comportamento de cada item vive no padrão correspondente (Editar, Excluir, Fixar…).

Aplicação

O mesmo menu aparece em papéis distintos — muda o gatilho e o conjunto de itens; o comportamento (abrir por clique, teclado, foco) é idêntico:

OndeGatilhoItens típicos
Ações por linha (index/lista)kebab (ellipsis-vertical)Ver · Editar · Duplicar · Excluir (destrutiva isolada)
Opções da ButtonBar"Opções" (ellipsis + rótulo)Imprimir · Exportar PDF · Histórico de versões · Configurações de exibição
Interação de entidade (documento)nome da entidade + chevronVer detalhes · Enviar para o Genius · Enviar mensagem

Estados

EstadoComportamento
FechadoSó o gatilho; o chevron aponta para baixo.
Aberto (ativo)O gatilho fica realçado (estado selecionado) e o chevron gira; o menu ancora ao gatilho.
Item destrutivoIsolado após um divisor, cor error.
Item desabilitadoInerte, percebido além da cor (aria-disabled); tooltip quando o motivo ajudar.

No código

UDropdownMenu — doc técnica em ui.nuxt.com/docs/components/dropdown-menu.

Acessibilidade

  • Trigger só-ícone (kebab) precisa de nome acessível (ex.: aria-label="Mais ações") e aria-expanded.
  • Teclado completo: abre por Enter/Espaço, navega com setas, fecha com Esc e por clique fora — sem disparar nenhuma ação ao fechar.
  • Ao fechar, o foco volta ao trigger.
  • Item desabilitado: percebido além da cor (aria-disabled) e, quando útil, tooltip explicando o motivo.
  • Ações destrutivas isoladas após divisor (ver Mais ações).

Onde se aplica