import : 
import Tooltip from '@mui/material/Tooltip';
component :  https://mui.com/material-ui/react-tooltip/

component : default


<Tooltip title="Delete">
      <IconButton>
            <DeleteIcon />
      </IconButton>
</Tooltip>

component : Arrow


<Tooltip title="Delete" arrow>
      <IconButton>
            <DeleteIcon />
      </IconButton>
</Tooltip>

component : Transitions
import : 
import Fade from '@mui/material/Fade'; 
FADE

<Tooltip title="FADE" arrow
      slots={{transition: Fade,}}
      slotProps={{transition: { timeout: 600 },}}
>
      <IconButton>FADE</IconButton>
import : 
import Zoom from '@mui/material/Zoom'; 
ZOOM

<Tooltip title="ZOOM" arrow
      slots={{ transition: Zoom, }}
>
      <IconButton>ZOOM</IconButton>
</Tooltip>

component : Positioned


<Tooltip title="Delete" arrow placement="top">
      <IconButton>
            <DeleteIcon />
      </IconButton>
</Tooltip>


<Tooltip title="Delete" arrow placement="left">
      <IconButton>
            <DeleteIcon />
      </IconButton>
</Tooltip>


<Tooltip title="Delete" arrow placement="right">
      <IconButton>
            <DeleteIcon />
      </IconButton>
</Tooltip>