Atoms
Tooltip
A popup that displays information on hover or focus.
shadcn/uiBased on shadcn/ui with Formance brand styling.
Installation#
npx shadcn@latest add @formance/tooltipInstall the following dependencies:
npm install radix-uiCopy and paste the following code into your project.
Update the import paths to match your project setup.
Usage#
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip'<TooltipProvider>
<Tooltip>
<TooltipTrigger>Hover me</TooltipTrigger>
<TooltipContent>
<p>View ledger details</p>
</TooltipContent>
</Tooltip>
</TooltipProvider>