| 1 | "use client"; |
| 2 | |
| 3 | import { Tooltip as TooltipPrimitive |
| 4 | import type React from |
| 5 | import { cn } |
| 6 | |
| 7 | export const TooltipCreateHandle: |
| 8 | TooltipPrimitive.createHandle; |
| 9 | |
| 10 | export const TooltipProvider: |
| 11 | |
| 12 | export const Tooltip: |
| 13 | |
| 14 | export function TooltipTrigger(props |
| 15 | return <TooltipPrimitive.Trigger data-slot |
| 16 | } |
| 17 | |
| 18 | export function TooltipPopup({ |
| 19 | className, |
| 20 | align = "center" |
| 21 | sideOffset = 4, |
| 22 | side = "top" |
| 23 | anchor, |
| 24 | children, |
| 25 | portalProps, |
| 26 | ...props |
| 27 | }: TooltipPrimitive. |
| 28 | align?: TooltipPrimitive |
| 29 | side?: TooltipPrimitive |
| 30 | sideOffset?: TooltipPrimitive |
| 31 | anchor?: TooltipPrimitive |
| 32 | portalProps?: TooltipPrimitive |
| 33 | }): React.ReactElement |
| 34 | return ( |
| 35 | <TooltipPrimitive.Portal {...portalProps |
| 36 | <TooltipPrimitive.Positioner |
| 37 | align={align} |
| 38 | anchor={anchor} |
| 39 | className="z-50 h-(--positioner-height) w-(--positioner-width) max-w-(--available-width) transition-[top,left,right,bottom,transform] data-instant:transition-none" |
| 40 | data-slot="tooltip-positioner" |
| 41 | side={side} |
| 42 | sideOffset={sideOffset} |
| 43 | > |
| 44 | <TooltipPrimitive.Popup |
| 45 | className={cn( |
| 46 | "relative flex h-(--popup-height,auto) w-(--popup-width,auto) origin-(--transform-origin) text-balance rounded-md border bg-popover not-dark:bg-clip-padding text-popover-foreground text-xs shadow-md/5 transition-[width,height,scale,opacity] before:pointer-events-none before:absolute before:inset-0 before:rounded-[calc(var(--radius-md)-1px)] before:shadow-[0_1px_--theme(--color-black/4%)] data-ending-style:scale-98 data-starting-style:scale-98 data-ending-style:opacity-0 data-starting-style:opacity-0 data-instant:duration-0 dark:before:shadow-[0_-1px_--theme(--color-white/6%)]", |
| 47 | className, |
| 48 | )} |
| 49 | data-slot="tooltip-popup" |
| 50 | {...props} |
| 51 | > |
| 52 | <TooltipPrimitive.Viewport |
| 53 | className="relative size-full overflow-clip px-(--viewport-inline-padding) py-1 [--viewport-inline-padding:--spacing(2)] data-instant:transition-none **:data-current:data-ending-style:opacity-0 **:data-current:data-starting-style:opacity-0 **:data-previous:data-ending-style:opacity-0 **:data-previous:data-starting-style:opacity-0 **:data-current:w-[calc(var(--popup-width)-2*var(--viewport-inline-padding)-2px)] **:data-previous:w-[calc(var(--popup-width)-2*var(--viewport-inline-padding)-2px)] **:data-previous:truncate **:data-current:opacity-100 **:data-previous:opacity-100 **:data-current:transition-opacity **:data-previous:transition-opacity" |
| 54 | data-slot="tooltip-viewport" |
| 55 | > |
| 56 | {children} |
| 57 | </TooltipPrimitive.Viewport> |
| 58 | </TooltipPrimitive.Popup> |
| 59 | </TooltipPrimitive.Positioner> |
| 60 | </TooltipPrimitive.Portal> |
| 61 | ); |
| 62 | } |
| 63 | |
| 64 | export { TooltipPrimitive, TooltipPopup |