Hover card

The popover surface opened by hover instead of a click: 320px, 500ms in, 200ms out. For previews of actors and records only — anything interactive belongs in a Popover so keyboard users can reach it.

<HoverCard>
  <HoverCardTrigger asChild>
    <a href="/actors/…" className="rounded-sm text-primary underline-offset-3 outline-hidden hover:underline focus-visible:underline focus-visible:ring-3 focus-visible:ring-ring/50">@pricing-agent</a>
  </HoverCardTrigger>
  <HoverCardContent>…</HoverCardContent>
</HoverCard>

Pricing agent preview

@pricing-agent

Human preview

@niek