<NotificationPopover/> component
<NotificationPopover /> is the dropdown-sized notification surface. It is the same content as the panel, just mounted as a floating popover instead of a full-width page block.
Usage
The following example shows a basic usage of <NotificationPopover />.
export default function Header() { return ( <div className="relative"> <NotificationPopover scope="all" /> </div> );}Behavior
The popover is just a positioned shell around <NotificationPanel />. It keeps the panel width constrained and lets the panel handle the actual notification content.
Positioning
You can pass the popover position when you need to anchor it to a custom trigger. The popover takes care of the floating container and scroll boundary, not the notification logic itself.