Popover

Floating content anchored to a trigger.

Installation

import { Popover } from "~/components/ui/Popover";

Usage

<Popover trigger={<Button>Details</Button>} title="Service window">
  <p>...</p>
</Popover>

API reference

PropTypeDefaultDescription
triggerReactElement-Element that opens the popover.
titleReactNode-Optional heading.
childrenReactNode-Popover body.

Accessibility

  • Built on the Base UI Popover: focus management, Escape to close, and aria wiring.
View site