Hover Card

Delayed hover preview card with trigger/content primitives.

More info

Usage

import {HoverCard, HoverCardContent, HoverCardTrigger} from 'kinu';

<HoverCard>
  <HoverCardTrigger>Hover me</HoverCardTrigger>
  <HoverCardContent>Details</HoverCardContent>
</HoverCard>

Exports

Name Description Rendered HTML
HoverCard Hover preview <div k="hover-card">
HoverCardTrigger Hover target <span k="hover-card-trigger">
HoverCardContent Preview content <div k="hover-card-content">

Notes

  • Uses CSS-only timers for opening and closing.
  • Content positioning is handled via data attributes.

_Source: src/components/hover-card/index.tsx