Como ele é
É o menu que aparece no clique com o botão direito, só que com a cara do seu produto. Um cartão branco de cantos arredondados surge onde você clicou, crescendo de leve, e lista ações com ícones, atalhos de teclado alinhados à direita, separadores e títulos de seção. Itens com uma seta abrem submenus ao lado, que podem ter outros submenus. Há opções com marca de seleção e grupos de escolha única, que mudam sem fechar o menu. Perto da borda, o menu abre para o outro lado. No celular, ele aparece com um toque longo e, quando o aparelho permite, uma vibração curta.
Você pode estar procurando isto se pediu algo assim
- trocar o menu do botão direito do navegador por um menu meu
- menu que abre quando clico com o botão direito em um arquivo
- opções que aparecem ao segurar o dedo em cima de um item no celular
- submenus que não fecham quando o mouse vai na diagonal
- ações rápidas por item, tipo duplicar, renomear e excluir, num menu
- menu de clique direito igual ao do Mac, com atalhos do lado
- deixar meu gerenciador de arquivos com cara de programa de computador
Também chamado de
- menu de contexto
- context menu
- menu do botão direito
- right-click menu
- menu de ações
- submenu em cascata
- long press menu
Quando usar
- Gerenciador de arquivos ou galeria de mídia com ações por item
- Quadros, kanbans e editores em que o botão direito agiliza o trabalho
- Tabelas de SaaS com ações por linha, como duplicar, fixar ou excluir
- Ferramentas de design com opções de exibição que ligam e desligam
Quando evitar
- Landing pages e sites de conteúdo, em que ninguém espera um menu no botão direito
- Ações essenciais que só existiriam no menu, sem um botão visível na tela
Como pedir para a sua IA
Crie um menu de contexto personalizado para os itens da minha lista de arquivos: abre no botão direito, no toque longo e com Shift+F10, tem submenus com triângulo de segurança, atalhos no formato de cada sistema, itens marcáveis, inversão nas bordas e navegação completa pelo teclado.
Com o THM Componentes, você cola o prompt completo do catálogo, que já traz o código-fonte deste componente, e a IA reproduz este efeito exato em vez de improvisar.
Perguntas sobre Context Menu
O Context Menu funciona no celular, onde não há botão direito?
Sim. Em telas de toque, o Context Menu abre com um toque longo de 500 ms, que você pode ajustar, e uma vibração curta nos aparelhos que permitem. Mover o dedo cancela a abertura, e no Android, que também dispara o evento de menu, o componente aceita o primeiro que chegar para não abrir duas vezes.
Dá para usar o Context Menu só pelo teclado?
Sim. Shift+F10 ou a tecla Menu abrem o Context Menu sobre o item focado. As setas percorrem as opções, a seta para a direita abre um submenu e a da esquerda volta, Enter ou espaço ativam, Esc fecha um nível e digitar as primeiras letras salta para o item. Os papéis ARIA de menu, marcável e rádio estão completos.
O que é o triângulo de segurança do Context Menu?
É o que impede o submenu de sumir quando o mouse vai na diagonal até ele. Enquanto o ponteiro se move dentro do triângulo entre o ponto de saída e a borda do submenu, o Context Menu não troca o submenu aberto pelos itens que o cursor cruza no caminho.
