# Canivete The menu that opens on right-click, with submenus, shortcuts and toggle options, styled like your app. > Canivete is an exclusive THM Componentes component that builds a right-click menu in your product's style. It opens on right-click, long press or Shift+F10, and has cascading submenus with a safe triangle, shortcuts shown in each platform's format, checkable and single-choice items, and full keyboard navigation. - Category: Cards and surfaces - Origin: THM exclusive, built by THM Tecnologia Inteligente; the prompt includes the full source code - Load weight: Light: CSS or light JavaScript, no noticeable cost - Technology: Vue 3, TypeScript - Interaction: Mouse, Touch, Keyboard - URL: https://vibecode.thmtecnologia.com/en/components/canivete/ ## What it looks like It is the menu that appears when you right-click, but with your product's look. A white card with rounded corners appears where you clicked, growing in slightly, and lists actions with icons, keyboard shortcuts aligned to the right, separators and section titles. Items with an arrow open submenus to the side, which can hold more submenus. There are options with check marks and single-choice groups, which change without closing the menu. Near the edge, the menu opens to the other side. On phones it appears after a long press, with a short vibration when the device allows. ## You may be looking for this if you asked for something like - “replace the browser right-click menu with my own menu” - “a menu that opens when I right-click a file” - “options that show up when you press and hold an item on mobile” - “a menu with submenus that do not close when the mouse moves diagonally” - “quick actions per item, like duplicate, rename and delete, in a menu” - “a right-click menu like the Mac one, with shortcuts on the side” - “make my file manager feel like a desktop app” ## Also known as right-click menu, custom context menu, cascading submenu, long press menu, action menu, popup menu with submenus ## When to use - A file manager or media library with actions per item - Boards, kanbans and editors where right-click speeds up work - SaaS tables with row actions like duplicate, pin or delete - Design tools with view options that toggle on and off ## When to avoid - Landing pages and content sites, where nobody expects a right-click menu - Essential actions that would only live in the menu, with no visible button ## How to ask your AI ```text Create a custom context menu for the items in my file list: it opens on right-click, long press and Shift+F10, has submenus with a safe triangle, shortcuts in each platform's format, checkable items, edge flipping and full keyboard navigation. ``` With THM Componentes, you paste the full prompt from the catalog, which already includes this component's source code, and the AI reproduces this exact effect instead of improvising. ## Questions about Canivete ### Does Canivete work on phones, where there is no right-click? Yes. On touch screens, Canivete opens after a 500 ms long press, which you can adjust, with a short vibration on devices that allow it. Moving the finger cancels the opening, and on Android, which also fires the menu event, the component takes whichever comes first so it never opens twice. ### Can I use Canivete with the keyboard only? Yes. Shift+F10 or the Menu key opens Canivete on the focused item. Arrow keys move through options, the right arrow opens a submenu and the left one goes back, Enter or Space activates, Esc closes one level and typing the first letters jumps to an item. ARIA roles for menu, checkbox and radio items are complete. ### What is the safe triangle in Canivete? It keeps a submenu from disappearing when the mouse moves diagonally toward it. While the pointer moves inside the triangle between the exit point and the submenu edge, Canivete does not swap the open submenu for the items the cursor crosses on the way. ## Related components - [Trevo](https://vibecode.thmtecnologia.com/en/components/trevo/): A search box that opens with Ctrl K or ⌘K to find pages and run actions without leaving the keyboard. - [Baliza](https://vibecode.thmtecnologia.com/en/components/baliza/): Tooltips and menus pinned to the button that opens them, switching sides on their own when they hit an edge. - [Bonde](https://vibecode.thmtecnologia.com/en/components/bonde/): A header menu where a single panel slides and resizes as you move from one item to the next. - [Baralho](https://vibecode.thmtecnologia.com/en/components/baralho/): Notifications that pop up in a corner, stacked like cards, and go away on their own or with a sideways swipe. - [Mezanino](https://vibecode.thmtecnologia.com/en/components/mezanino/): A panel that slides up from the bottom of the screen, stops at three heights and follows your finger. --- THM Componentes: THM Componentes is a catalog of 268 UI components for Vue 3 and Nuxt, 115 of them exclusive, each with a live demo and a ready prompt for Claude Code, Cursor and other AI assistants. Pick the effect, copy the prompt and your AI applies it to your project. Lifetime access for R$ 497 (about US$ 99).