Tooltip

Popup that displays information related to an element when it receives keyboard focus or hover.

Installation

# Install @opencosmos/ui to use Tooltip
pnpm add @opencosmos/ui

Preview

Loading preview...

Usage

Import

import { Tooltip } from '@opencosmos/ui';

Example

<Tooltip>
  Content
</Tooltip>

Eject

Copy this component into your project for full customization

Code Examples

Basic Usage

Simple tooltip on hover

import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@opencosmos/ui"

<TooltipProvider>
  <Tooltip>
    <TooltipTrigger>Hover</TooltipTrigger>
    <TooltipContent>
      <p>Tooltip content</p>
    </TooltipContent>
  </Tooltip>
</TooltipProvider>