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