Feature: improved tooltips for components #3326
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
pjosh
approved these changes
Feb 28, 2018
| constructor(props) { | ||
| super(props); | ||
| this.state = { | ||
| disableTooltips: false |
| position="top" | ||
| arrow | ||
| disabled={isDeviceTouch} | ||
| html={<Tip text={tooltip.text} />} |
There was a problem hiding this comment.
Yeah, probably we will never use other component instead of <Tip> and if this happens we can overwrite it with {...tooltip}. I love it! good job.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Improves the use of tooltips in buttons and dropdowns. Now both can accept a much simpler tooltip object:
{ text: "my excellent message" }However if you would like more customisation then you can pass any option from react tippy props as well:
{ text: "my message", delay: 3000 }This was to reduce the importing of the Tip component throughout the project when its application was always the same.
In addition a tooltip has been added for the Dropdown component to allow the header section of the dashboard to have individual tooltips without extra code.
FINALLY, I also added a state prop which prevent tooltips from being shown in the header when a dropdown is open. This makes the user a lot happier I think.