Component
Popover
Displays interactive floating content from a trigger.
Install
Run the CLI to copy the source into your project.
pnpm dlx @stalk-ui/cli add @stalk-ui/popoverExamples
Live previews render through the docs app's PandaCSS codegen.
<Popover.Root> <Popover.Trigger>Open popover</Popover.Trigger> <Popover.Content>Quick actions go here.</Popover.Content> </Popover.Root>
<Popover.Root> <Popover.Trigger>Filters</Popover.Trigger> <Popover.Content side="bottom" align="start"> Filter controls render below the trigger. </Popover.Content> </Popover.Root>
Props
Public component props extracted from the source TypeScript types.
| Prop | Type | Required | Default | Description |
|---|---|---|---|---|
| `scrollable` | `boolean` | No | - | Cap height to the available space and scroll within (with overscroll<br /> containment) instead of overflowing — for tall panels like filter lists. |
Variants
Variant axes exposed by the underlying PandaCSS recipe or slot recipe.
| Variant | Values |
|---|---|
| `scrollable` | `true`, `false` |
Registry
Files this component contributes to your registry install.
- Manifest: `/r/popover.json`
- Recipe: `popover`
- Files: `src/components/ui/popover.tsx`