| 15 | } |
| 16 | |
| 17 | function TooltipPopup({ |
| 18 | className, |
| 19 | align = "center", |
| 20 | sideOffset = 4, |
| 21 | side = "top", |
| 22 | children, |
| 23 | ...props |
| 24 | }: TooltipPrimitive.Popup.Props & { |
| 25 | align?: TooltipPrimitive.Positioner.Props["align"]; |
| 26 | side?: TooltipPrimitive.Positioner.Props["side"]; |
| 27 | sideOffset?: TooltipPrimitive.Positioner.Props["sideOffset"]; |
| 28 | }) { |
| 29 | return ( |
| 30 | <TooltipPrimitive.Portal> |
| 31 | <TooltipPrimitive.Positioner |
| 32 | align={align} |
| 33 | className="z-50 h-(--positioner-height) w-(--positioner-width) max-w-(--available-width) transition-[top,left,right,bottom,transform] data-instant:transition-none" |
| 34 | data-slot="tooltip-positioner" |
| 35 | side={side} |
| 36 | sideOffset={sideOffset} |
| 37 | > |
| 38 | <TooltipPrimitive.Popup |
| 39 | className={cn( |
| 40 | "relative flex h-(--popup-height,auto) w-(--popup-width,auto) origin-(--transform-origin) text-balance rounded-md border bg-popover bg-clip-padding text-popover-foreground text-xs shadow-black/5 shadow-md 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:bg-clip-border dark:before:shadow-[0_-1px_--theme(--color-white/8%)]", |
| 41 | className, |
| 42 | )} |
| 43 | data-slot="tooltip-popup" |
| 44 | {...props} |
| 45 | > |
| 46 | <TooltipPrimitive.Viewport |
| 47 | 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" |
| 48 | data-slot="tooltip-viewport" |
| 49 | > |
| 50 | {children} |
| 51 | </TooltipPrimitive.Viewport> |
| 52 | </TooltipPrimitive.Popup> |
| 53 | </TooltipPrimitive.Positioner> |
| 54 | </TooltipPrimitive.Portal> |
| 55 | ); |
| 56 | } |
| 57 | |
| 58 | export { |
| 59 | TooltipCreateHandle, |