Peek Card
An origin-anchored contextual preview popover that emerges directly from target triggers on hover or tap with smart collision edge detection and rich metadata summaries.
Hover over: Payment #3948
Contextual preview card emerging smoothly from trigger element
Installation
Add the component directly to your repository using shadcn CLI:
npx shadcn@latest add Surajmaurya1/easyui/peek-card
API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
| children | ReactNode | undefined | Trigger target element wrapped by peek card |
| data | PeekCardData | [...] | Structured preview dataset |
| delay | number | 200 | Hover activation delay in milliseconds |
| placement | 'top' | 'bottom' | 'auto' | 'auto' | Preferred emergence direction |
| isLoading | boolean | false | Renders skeleton placeholder during async lookup |