-
Notifications
You must be signed in to change notification settings - Fork 10
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
feat: tippy.js tooltips & interaction mode toggle #9
Conversation
Dynamic6448
commented
Jul 10, 2023
- Added a new toggle input to enable/disable interaction mode
- Add tooltips to instrument buttons (interaction-mode, toggle refresh button, & auto-refresh toggle)
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I think we should use tippy.js
instead since it has a handy prop called appendTo
that lets us portal the tooltip out of the workspace. That way, the tooltip is not affected by the zoom level set by the workspace transform.
It also foregoes the data-tooltip-id
props and instead renders based on children. For example:
<Tippy content="Refresh Instrument" appendTo={document.body}>
<button className="ml-auto" onClick={refresh}>
<HiRefresh className="cursor-pointer active:text-silver-500" size={22} />
</button>
</Tippy>
Let me know what you think, always open to discussing alternatives.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Cool stuff!