equinor
🏷️ Allow ReactNode as title in Tooltip
What does this pull request change?
Add ReactNode to the title prop in the Tooltip component.
Why is this pull request needed?
The title is used directly in the JSX and passing custom components as title seems to work.
Not sure this is intended, up to the EDS team.
I have to check a bit more if this should be allowed. This might get vetoed by our designers since tooltip should be strictly for short feedback etc and to use Popover for more complex formatted output
Just to chime in: We have often also wanted to have a bit more comples values in the tooltip. Supersimple example is just being able to make part of the text cursive/bold, e.g "You should not do xyz". Another example is just to have an extra line to improve readability by splitting the text naturally. We often fall back to the native title-attribute here, since it adheres to \n for linebreaks (in some browser/os-combos at least)
This has been requested by our designers several times, where the popover is far to intrusive but the tooltip is to limited.
We actually discussed this with a former EDS designer (Lucas) who said that it should be treated as guidelines and not rules. In this case it seems like it's expected as a rule. Imo, the result of such restrictions doesnt lead to a better / more consistent design across Equinor, but rather the opposite, since those who have the requirement will just roll their own variants.
I would be interested getting some perspectives from the EDS designers (@BirteThornquist / @benteljones?) on why this rule is in place, and their thoughts on the points I outlined above.
We're going to go through all the old guidelines and create new examples. Several of them are outdated. Although we want the tooltip to be primarily for short, one-line information, we need to facilitate a slightly more adapted context. As you point out @yusijs , it will not lead to a more consistent use, but rather the opposite if the restrictions don't cover what the users need. We will take these needs with us into the work on an updated 2.0 component. Thank you for the important feedback. 🌸
