How to import two component but same name from two libraries?

Question

I need Tooltip component from two libraries. For example

import { Tooltip } from "react-leaflet";
import { Tooltip } from "recharts";

But the same name of Tooltip of two libraries, I get an error. How to import Tooltip without error.

Readable

Answer 1

import { Tooltip as LeafletTooltip } from "react-leaflet";

And then using <LeafletTooltip> below

Curitiba

Answer 2

import { Tooltip as ReactLeafletTooltip} from "react-leaflet";
import { Tooltip as RechartsTooltip} from "recharts";

then use it in render as

<RechartsTooltip/>
<ReactLeafletTooltip/>

Ridotto