Hover CardProv1.0.0

Installation

Needs your registry key. Your components.json style picks the Base UI or Radix build: radix-*, new-york and default get Radix, base-* gets Base UI.

{
  "registries": {
    "@beautiful-ui": "https://beautiful-ui.dev/r/{style}/{name}.json",
    "@beautiful-ui-pro": {
      "url": "https://beautiful-ui.dev/r/pro/{style}/{name}.json",
      "headers": { "Authorization": "Bearer ${BEAUTIFUL_UI_TOKEN}" }
    }
  }
}

Props

• HoverCard–

  as the primitive

  open, defaultOpen, onOpenChange.

• HoverCardTrigger delay / closeDelay–

  number

  320ms to open (60ms when moving from another open card), 0 to close. Radix: openDelay / closeDelay on HoverCard.

• HoverCardChip–

  { initials, agent? } + trigger props

  The designed trigger: an inline chip; children are the handle.

• HoverCardContent–

  side, sideOffset, align, collisionPadding, container

  Above its trigger by default (side top, 10px), kept 12px inside the viewport, flipping below when there's no room.

• HoverCardPerson–

  { person: { name, initials, role, note, stats, status, online, agent } }

  The designed body.