| 1 | import * as React from "react"
|
| 2 | import { Tooltip as TooltipPrimitive } from "radix-ui"
|
| 3 |
|
| 4 | import { cn } from "@/lib/utils"
|
| 5 |
|
| 6 | function TooltipProvider({
|
| 7 | delayDuration = 0,
|
| 8 | ...props
|
| 9 | }: React.ComponentProps<typeof TooltipPrimitive.Provider>) {
|
| 10 | return (
|
| 11 | <TooltipPrimitive.Provider
|
| 12 | data-slot="tooltip-provider"
|
| 13 | delayDuration={delayDuration}
|
| 14 | {...props}
|
| 15 | />
|
| 16 | )
|
| 17 | }
|
| 18 |
|
| 19 | function Tooltip({
|
| 20 | ...props
|
| 21 | }: React.ComponentProps<typeof TooltipPrimitive.Root>) {
|
| 22 | return <TooltipPrimitive.Root data-slot="tooltip" {...props} />
|
| 23 | }
|
| 24 |
|
| 25 | function TooltipTrigger({
|
| 26 | ...props
|
| 27 | }: React.ComponentProps<typeof TooltipPrimitive.Trigger>) {
|
| 28 | return <TooltipPrimitive.Trigger data-slot="tooltip-trigger" {...props} />
|
| 29 | }
|
| 30 |
|
| 31 | function TooltipContent({
|
| 32 | className,
|
| 33 | sideOffset = 0,
|
| 34 | children,
|
| 35 | ...props
|
| 36 | }: React.ComponentProps<typeof TooltipPrimitive.Content>) {
|
| 37 | return (
|
| 38 | <TooltipPrimitive.Portal>
|
| 39 | <TooltipPrimitive.Content
|
| 40 | data-slot="tooltip-content"
|
| 41 | sideOffset={sideOffset}
|
| 42 | className={cn(
|
| 43 | "z-50 w-fit origin-(--radix-tooltip-content-transform-origin) animate-in rounded-md bg-foreground px-3 py-1.5 text-xs text-balance text-background fade-in-0 zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95",
|
| 44 | className
|
| 45 | )}
|
| 46 | {...props}
|
| 47 | >
|
| 48 | {children}
|
| 49 | <TooltipPrimitive.Arrow className="z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px] bg-foreground fill-foreground" />
|
| 50 | </TooltipPrimitive.Content>
|
| 51 | </TooltipPrimitive.Portal>
|
| 52 | )
|
| 53 | }
|
| 54 |
|
| 55 | export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider }
|