Not affiliated with official shadcn/ui. Visit ui.shadcn.com for official docs.
React Dropdown Menu - File Actions Dropdown
A React dropdown menu with file action options including view, download, share, duplicate, archive, and delete with keyboard shortcuts
Looking to implement shadcn/ui patterns?
Join our Discord community for help from other developers.
You know that three-dot menu you see on every file in Google Drive or Dropbox? This React dropdown menu packs all those file actions into one clean component using shadcn/ui and Radix UI. Built with Lucide React icons and keyboard shortcuts, users get View Details, Download, Share, Duplicate, Archive, and Delete options—perfect for file managers, document libraries, cloud storage interfaces, and any app where users need quick access to file operations.
Pattern created by @haydenbleasel
Installation
Related patterns you will also like
Table Row Actions
Dropdown for data table row operations
Card Actions with Share
Menu with nested submenu for social sharing
Batch Actions Dropdown
Bulk operations menu for multiple items
Standard Dropdown Menu
Basic dropdown menu with simple items
Quick Actions Menu
Grouped actions with keyboard shortcuts
File Context Menu
Right-click context menu for files
Questions you might have
React Top Drawer Command Bar
A React top drawer command palette with search input and keyboard shortcut badges for quick command access like create, open, search, and settings
React Dropdown Menu - Table Row Actions
A React dropdown menu for data table row actions with edit, duplicate, favorite, report, archive, and delete operations in a compact vertical layout