-
-
Notifications
You must be signed in to change notification settings - Fork 29
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
fix(tooltip): allow multiple tooltips per grid cell #1448
Conversation
- prior to this PR, we could only have 1 tooltip per cell, but in some occasions, we might have a cell with multiple icons & tooltips, if that happens then we should have separate tooltips (with their dedicated & different tooltipt text) positioned on that inner icon
Run & review this pull request in StackBlitz Codeflow. |
@zewa666 I got a POC mostly working, however I did find some separate/existing bugs with the tooltip plugin and I have identified a few things to potentially do and new options to add in the TODOs list above. Feel free to provide feedback, you could also give it a try by using this awesome new individual PR Stackblitz link. |
Codecov ReportAll modified and coverable lines are covered by tests ✅
Additional details and impacted files@@ Coverage Diff @@
## master #1448 +/- ##
========================================
+ Coverage 99.8% 99.8% +0.1%
========================================
Files 199 199
Lines 21621 21682 +61
Branches 7236 7123 -113
========================================
+ Hits 21557 21618 +61
+ Misses 64 58 -6
- Partials 0 6 +6 ☔ View full report in Codecov by Sentry. |
- that required to add 4 new SlickEvent for header mouseover (instead of mouseenter which is not sufficient)
- Example 16 tooltip wasn't showing progress bar html, this was a regression that arrived after converted all Formatters to native HTML instead of returning HTML string - also fixed an issue with long text that is larger than the div width, the ellipsis should show but it wasn't. We can fix this by adding an inner div for the text body and move the text into it and show the ellipsis on that inner div instead of the full tooltip container
- also fix tooltip text color for dark mode
- also fix tooltip text color for dark mode
…ing/slickgrid-universal into bugfix/multiple-tooltips
TODOs
mouseenter
but we needmouseover
to differentiate multiple tooltip within the same header (mouseenter
only gets triggered once whilemouseover
gets triggered multiple times while hovering any of element within container). So instead of possible chaning the previous behavior, I decided to duplicateonHeaderMouseEnter
toonHeaderMouseOver
and the same goes foronHeaderRowMouseEnter
and also...MouseOut
for both header types too (so adding 4 new events to cover all use cases). The funny thing is that the event for the cellonMouseEnter
is actually usingmouseover
which is not actually matching with its name.Example 22 (align right)
Example 11 (align left)
Example 12 (multiple tooltips in header row)
existing bugs