Components
Popover
A glass panel anchored to a button: springs open on click, moves focus inside, closes on Escape or outside click.
Paste it into ChatGPT, Claude, Cursor or v0.
Usage
import { Popover, Button } from '@vizzele/react';
<Popover label="Share" content={<ShareOptions />}>
{(props) => <Button {...props}>Share</Button>}
</Popover>Props
| Prop | Type | Default | Description |
|---|---|---|---|
children | (triggerProps) => ReactNode | — | Render your trigger with the given props. |
content | ReactNode | — | Panel content. |
placement | Placement | 'bottom' | Preferred side. |
open / onOpenChange | boolean | — | Optional control. |
label | string | — | Accessible name of the panel. |
Accessibility
- Trigger gets aria-expanded/aria-controls; focus moves into the panel and returns on Escape.