Tooltip

The Tooltip component displays positioned tooltip content around a trigger element. It supports four positions: top, down, left, and right.

Import

import { Tooltip } from "amvasdev-ui";

Examples

Basic Usage

Look at meThis is a helpful tooltip
<span className="relative">
  Look at me
  <Tooltip content="This is a helpful tooltip" position="top" />
</span>

Different Positions

Look at meTop tooltip
<span className="relative">
  Look at me
  <Tooltip content="Top tooltip" position="top" />
</span>

Notes

  • The Tooltip component must be placed inside a container with relative positioning
  • For buttons with tooltips, use the IconButton component's tooltip prop