Tooltip

A popup that displays information related to an element when the element receives keyboard focus or the mouse hovers over it.

Preview

This is a tooltip

Positions

Top

Right

Bottom

Left

Usage

"use client"

import { Tooltip, TooltipTrigger, TooltipContent, Button } from "@neo/test-components"

export function TooltipDemo() {
  return (
    <Tooltip>
      <TooltipTrigger>
        <Button>Hover me</Button>
      </TooltipTrigger>
      <TooltipContent>
        This is a tooltip
      </TooltipContent>
    </Tooltip>
  )
}

// With placement
<Tooltip placement="right">
  <TooltipTrigger>
    <Button>Right tooltip</Button>
  </TooltipTrigger>
  <TooltipContent>
    Appears on the right
  </TooltipContent>
</Tooltip>

Note: Tooltip requires a client component for interactivity.

This is a placeholder page showing a static preview.