Tooltip positioned incorrectly when target is an SVG

[raymondcao-everlaw]

I'm submitting a ... (check one with "x")

[x ] bug report
[ ] feature request
[ ] support request => Please do not submit support request here, instead see https://forum.primefaces.org/viewforum.php?f=57

Codesandbox Case (Bug Reports)

The first SVG circle in the sandbox below shows the bug. The second shows expected behavior (this is achieved by wrapping the SVG in a div as a workaround).

https://codesandbox.io/s/primereact-test-forked-97oko?file=/src/index.js

Current behavior
If the target of a global tooltip is an SVG, the tooltip will not be positioned next to the target when triggered (it will often appear offscreen).

Expected behavior
If the target of a global tooltip is an SVG, the tooltip will should be positioned next to the target.

Minimal reproduction of the problem with instructions

See sandbox link.

<>
    <Tooltip target=".svgtarget" autoHide={false} focusable={false}>
        Test Tooltip
    </Tooltip>
    <svg width="100" height="100" className="svgtarget">
        <circle cx="50" cy="50" r="40" stroke="green" strokeWidth="4" fill="yellow" />
    </svg>
</>

Please tell us about your environment:

• React version: 17.0.1

• PrimeReact version: 7.0.0

• Browser: Chrome 95.0.4638.69

• Language: Typescript, Javascript