Not affiliated with official shadcn/ui. Visit ui.shadcn.com for official docs.
React Context Menu - Group and Lock Menu
A React context menu for grouping, ungrouping, locking, and unlocking canvas elements with keyboard shortcuts for design tools
Looking to implement shadcn/ui patterns?
Join our Discord community for help from other developers.
Managing dozens of canvas elements without grouping and locking is chaos. This React context menu provides essential organization tools—group related elements, ungroup for individual edits, and lock to prevent accidental changes. Built with shadcn/ui and Radix UI with keyboard shortcuts and Lucide React icons—perfect for design editors, wireframe tools, or presentation software.
Pattern created by @haydenbleasel
Installation
Related patterns you will also like
Layer Arrange Menu
Z-index controls for layer stacking order
Align and Distribute Menu
Alignment and distribution with nested submenus
Layer Management Menu
Layer duplication, merging, and visibility controls
Transform Menu
Rotation, flipping, and scaling operations
Standard Context Menu
Basic context menu pattern for general use
File Context Menu
File operations with keyboard shortcuts
Questions you might have
React Context Menu - Align and Distribute Menu
A React context menu with nested submenus for alignment (left, center, right, top, middle, bottom) and distribution (horizontal, vertical) controls
React Context Menu - Layer Management Menu
A React context menu for layer management with duplicate, merge, flatten, and visibility toggle operations for image editors and design tools