Row Actions Menu Blueprint
Static blueprint of a documents table with one per-row overflow menu rendered open inline showing Edit, Duplicate, Move, and Delete actions without any Radix portal.
Static blueprint of a documents table with one per-row overflow menu rendered open inline showing Edit, Duplicate, Move, and Delete actions without any Radix portal.
Search blocks by description or jump to a page.
The source for every Application block is included with Basic and Pro. Pick a plan to copy the code.
Already purchased? Log in
Row Actions Menu Blueprint is the documents table with one overflow menu shown open, rendered as static markup so it works inside the preview without any Radix portal escaping the root. The Marketing Brief row is in the open state: a small rounded panel slides in below it with four actions, Edit, Duplicate, Move to folder, and Delete in muted-foreground weight to signal danger without a red color. The active row background is muted to keep the eye on the open panel.
Files are one const array with a menuOpen boolean per row; only the third entry has it true. The inline panel is a plain div, not a DropdownMenu, so screenshots and copy-paste both capture the correct open state.
Reach for this block as the reference layout when building any table that needs per-row contextual actions, replacing the static panel with a real dropdown trigger wired to your handler. The blueprint shows exactly what to build before reaching for Radix.
A natural flow around it on an Application Pro page:
Before
After
One strong use is the document library with per-row overflow actions. Other row action menus:
Tip: put destructive actions below a divider in muted-foreground, the visual separation is safer than a color that accessibility reviewers will flag.