Popover

Anchored floating content.

import { Popover } from '@ybouhjira/hyperkit';

#Playground

Edit the code — the preview recompiles and re-renders as you type.

Loading preview…

Prop	Type	Default	Description
`trigger` *	`JSX.Element`	—	The trigger element that opens the popover.
`content` *	`JSX.Element`	—	The content rendered inside the popover panel.
`placement`	`'top' \| 'bottom' \| 'left' \| 'right'`	`'bottom'`	Placement of the popover relative to the trigger.
`open`	`boolean`	—	Controlled open state.
`onOpenChange`	`(open: boolean) => void`	—	Callback when open state changes.
`class`	`string`	—	Additional CSS classes applied to the content panel.
`style`	`JSX.CSSProperties`	—	Inline styles for the content panel.

* required prop.

This component reads the following CSS custom properties. Override them globally or per-instance to restyle it — see the CSS Variables guide.