opinion
Popover
A floating panel that opens from a click on its trigger.
FiltersClick to open, Escape or a click outside to close
In context
Project headerA people popover and a filter popover on one toolbar
Harbour rebrandIdentity, site and launch kit for the harbour trust.
On trackProps
| Prop | Type | Required | Default |
|---|---|---|---|
trigger | ReactElement<unknown, string | JSXElementConstructor<any>> | Yes | — |
open | boolean | undefined | No | — |
onOpenChange | ((open: boolean) => void) | undefined | No | — |
sideOffset | number | undefined | No | 4 |
contentProps | Record<string, unknown> | undefined | No | — |
Accessibility
Real Radix Popover underneath: focus moves into the panel on open and returns to the trigger on close, Escape closes it, and a click outside closes it. role and focus trapping come from Radix, not reimplemented here.
data-rebar-* attributes
data-rebar-component="popover" on the content panel.
Migrating to Ant Design
Not codemod-covered — AntD's Popover takes content/title props directly rather than a children-as-panel-content shape, so mapping this over is a structural change, not a rename.