# Canivete O menu que aparece no clique com o botão direito, com submenus, atalhos e opções marcáveis, no visual do seu app. > Canivete é um componente exclusivo do THM Componentes que cria o menu do botão direito no visual do seu produto. Abre pelo clique direito, pelo toque longo ou por Shift+F10 e tem submenus em cascata com triângulo de segurança, atalhos no formato de cada sistema, itens marcáveis e de escolha única e navegação completa pelo teclado. - Categoria: Cartões e superfícies - Origem: Exclusivo THM, criado pela THM Tecnologia Inteligente; o prompt traz o código-fonte completo - Peso no carregamento: Leve: CSS ou JavaScript leve, sem custo perceptível - Tecnologia: Vue 3, TypeScript - Interação: Mouse, Toque, Teclado - URL: https://vibecode.thmtecnologia.com/componentes/canivete/ ## 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, menu do botão direito, right-click menu, menu de ações, submenu em cascata, long press menu, menu personalizado do clique direito ## 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 ```text 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 Canivete ### Canivete funciona no celular, onde não há botão direito? Sim. Em telas de toque, Canivete 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 Canivete só pelo teclado? Sim. Shift+F10 ou a tecla Menu abrem Canivete 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 de Canivete? É 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, Canivete não troca o submenu aberto pelos itens que o cursor cruza no caminho. ## Componentes relacionados - [Trevo](https://vibecode.thmtecnologia.com/componentes/trevo/): Uma janela de busca que abre com Ctrl K ou ⌘K para achar páginas e executar ações sem tirar as mãos do teclado. - [Baliza](https://vibecode.thmtecnologia.com/componentes/baliza/): Balões de dica e menus presos ao botão que os abre, que mudam de lado sozinhos quando encostam na borda. - [Bonde](https://vibecode.thmtecnologia.com/componentes/bonde/): Um menu de cabeçalho em que um único painel desliza e muda de tamanho ao passar de um item para outro. - [Baralho](https://vibecode.thmtecnologia.com/componentes/baralho/): Avisos que surgem no canto da tela, empilhados como cartas, e somem sozinhos ou com um arraste para o lado. - [Mezanino](https://vibecode.thmtecnologia.com/componentes/mezanino/): Um painel que sobe da parte de baixo da tela, para em três alturas e pode ser puxado com o dedo. --- THM Componentes: O THM Componentes é um catálogo de 268 componentes de interface para Vue 3 e Nuxt, 115 deles exclusivos, com demonstração ao vivo e um prompt pronto para Claude Code, Cursor e outros assistentes. Você escolhe o efeito, copia o prompt e a sua IA aplica no projeto. Acesso vitalício por R$ 497.