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

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

export default ToolTip