Components

Animated Tooltip

Overlapping avatar row where the tooltip leans with your cursor: its tilt and horizontal shift follow where you are over the avatar, so the card feels balanced on your fingertip.

MV
TL
PR
AT

Install

Copies the component source — plus its small internal deps — into your project. You own the code from the first minute.

terminal
npx lumora-ui@latest add animated-tooltip

Import

Using the workspace package instead? Deep imports keep cold starts lean; the barrel is fully tree-shakable either way.

app/page.tsx
import { AnimatedTooltip } from "@lumora/ui/components/animated-tooltip";
// or from the barrel:
import { AnimatedTooltip } from "@lumora/ui";

Props worth knowing

items is an array of { id, name, hint?, src? } — omit src to fall back to initials. avatarSize sets the avatar diameter in px (default 44). The tooltip leans with your cursor over each avatar. Props extend the natural HTML element, so className, event handlers, and aria attributes pass straight through.