A popover is a small panel that opens next to a button, for things you interact with: filters, a short form, a color picker. It is a native popover="auto", so the browser closes it on Escape or a click outside, returns focus, and puts it right after its trigger in the tab order.
A hovercard is a rich tooltip. It opens after a short hover, or at once on keyboard focus, and describes its trigger. It stays open while the pointer moves onto it, so its text can be read and selected.
Both flip to the other side when there is no room, stay on screen, and follow their trigger as the page scrolls.
Filters
A popover with a form inside. arrow points it at its trigger, and hide() closes it from code.
Showing open, in review issues.
Hovercard
Hover a name, or reach it with Tab. The card describes the link, so screen readers read it after the name.
Sides and entrances
side and align set where it opens; start and end follow the writing direction. enter and motion set how it arrives.