Not affiliated with official shadcn/ui. Visit ui.shadcn.com for official docs.
React Popover with List
Popover displaying simple text list items in space-y-2 layout for quick reference lists and options built with shadcn/ui
Looking to implement shadcn/ui patterns?
Join our Discord community for help from other developers.
Lists belong in context—not always in permanent UI. This React popover presents simple list items in space-y-2 vertical stack using shadcn/ui and text-sm styling. Built with Radix UI primitives, list popovers provide scannable options—perfect for recent items, quick links, filter options, status lists, available choices, or any scenario where vertical list of text items needs proximity to trigger without dedicating permanent screen space or complex menu structures.
Pattern created by @haydenbleasel
Installation
Related patterns you will also like
Popover with Actions
Action buttons instead of text items
Dropdown Menu
Clickable menu items with actions
Notifications Popover
Notification list with details
Select
Dropdown select with options
Combobox
Searchable select list
Command Menu
Searchable command palette
Questions you might have
React Info Icon Popover
Info icon button triggering popover with helpful text using ghost variant for subtle help indicators built with shadcn/ui
React User Profile Popover
User profile card popover with name, username, and bio using ghost button trigger for social media hover cards built with shadcn/ui