import React from 'react'
import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '../ui/tooltip'
import { cn } from '@/lib/utils'

const ToolTip = ({ children, content, className }: any) => {
    return (
        <div>
            <TooltipProvider delayDuration={1} >
                <Tooltip >
                    <TooltipTrigger asChild>
                        {children}
                    </TooltipTrigger>
                    <TooltipContent align='start' sideOffset={5} className={cn("max-w-[200px] break-words whitespace-normal", className)}>
                        <p className="text-white" style={{ color: 'white' }}>{content}</p>
                    </TooltipContent>
                </Tooltip>
            </TooltipProvider>
        </div>
    )
}

export default ToolTip