Hover Card
Rich preview on hover or focus — profile cards, link previews — that stays open while you move onto it.
5 files · 240 locdeps: clsx, tailwind-merge
Designed by @ada and shipped with OPUS UI.
Installation
With the shadcn CLI, pointing at this platform’s registry:
npx shadcn@latest add https://opusui.131199999.xyz/r/hover-card.jsonOr offline, straight from your opus55 checkout (copies every file it needs):
node ../tailwind_component/opus55/scripts/add.mjs hover-cardUsage
import { HoverCard } from "@/components/opus/ui/hover-card";
<HoverCard trigger={<a href="/u/ada">@ada</a>}>…</HoverCard>API
| Prop | Type | Default | Description |
|---|---|---|---|
| trigger / children | ReactElement / ReactNode | — | Anchor and card content. |
| openDelay / closeDelay | number | 450 / 200 | Delays (ms). |
| side / align | Side / Align | — | Placement. |