Popover

Displays rich content in a portal, anchored to a trigger element.

$bunx shadcn@latest add @nx-ui/popover
Registry item
Installs withutils
Used byapp-switchercalendar-viewcolor-pickerdata-tabledate-pickerfilter-barisochrone-toolnotification-centresite-header

Basic usage

PopoverTrigger opens PopoverContent below it on click; PopoverHeader groups a title and description.

Placement

side and align position the popup relative to its trigger; sideOffset and alignOffset fine-tune the gap.

Trigger styles

Any Button variant, or an icon-only button, can open the popover.

Disabled trigger

A disabled Button trigger cannot be opened, for actions that are temporarily unavailable.

Controlled

Drive open state yourself with open and onOpenChange.

Composition: add a lab note

A form inside the popup for jotting a note against a sample, the kind of quick-capture pattern used across the Nexus ReGen lab tools.

RH

Sample SS-0388

Ridgeway Reclamation, plot 1

Composition: sample summary card

A richer popup combining an icon, badge and key figures — a soil sample summary anchored to a table row.

API reference

Exported parts and their props, extracted from the component source.