Description
Related to: #837
Is your feature request related to a problem? Please describe.
In the v4 version, it was easily possible to display a single tooltip on multiple elements using the data-for attribute. Since v5, this was removed and replaced by "anchorIDs". The problem is now that IDs are unique, which is why a single tooltip can be linked to a single DOM element only.
The https://react-tooltip.com/docs/examples/multiple-anchors solutions explained are in my opinion not equivalent.
The Provider solution has the drawbacks, that a) you increase your nesting level, b) you can not dynamically load it, c) you have to manage the anchor state manually, which in your example does not work good (https://react-tooltip.com/docs/examples/state#controlled-tooltip-state).
There is also a lot of documentation missing.
The TooltipWrapper solution (is it related to the provider? It looks like this from the docs but would not make much sense) just unnecessarily bloats the DOM. Just image having 1000 Tooltips in a single page.
Describe the solution you'd like
The v4 solution with data-for was perfect and no other library had a matching function that worked this well. It scales good, cause the number of anchors does not increase the number of tooltips. It was lightweight, cause all it needed was a "data-for" and a "data-tip", something you could generate anywhere. And most important: it did not need you to manage the state across the multiple anchors.
Additional context
My use case is: Large HTML pages are generated in a backend. There are multiple important words that should show a tooltip in the frontend. So, the backend is adding a static data-for and the data-tip with content. There are pages with ~500 important words, so many data-tips. The frontend is receiving the HTML, parsing it and displays it afterwards. The website needs to display large structures, so the overall number of elements is high, which is why more DOM elements or providers will slower the performance noticeably.