Elgato_dark/ToolJet
1
0
Fork 0
mirror of https://github.com/ToolJet/ToolJet synced 2026-05-24 09:28:31 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Feature: Show tooltip for widgets (#318)

Browse source 
* Show tooltip containing widget description when hovered over a widget

* Refactor import
This commit is contained in:
Prasad Walvekar 2021-06-25 21:28:50 +05:30 committed by GitHub
parent 301c385816
commit 511022b3e9
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 7 additions and 0 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
frontend/src/Editor/Box.jsx
View file

@ -15,6 +15,8 @@ import { Multiselect } from './Components/Multiselect';
import { Modal } from './Components/Modal';
import { Chart } from './Components/Chart';
import { Map } from './Components/Map';
import { renderTooltip } from '../_helpers/appUtils';
import OverlayTrigger from 'react-bootstrap/OverlayTrigger';
const AllComponents = {
Button,
@ -68,6 +70,10 @@ export const Box = function Box({
const ComponentToRender = AllComponents[component.component];
return (
<OverlayTrigger
placement="top"
overlay={(props) => renderTooltip({props, text: `${component.description}`})}
>
<div style={{ ...styles, backgroundColor }} role={preview ? 'BoxPreview' : 'Box'}>
{inCanvas ? (
<ComponentToRender
@ -106,5 +112,6 @@ export const Box = function Box({
</div>
)}
</div>
</OverlayTrigger>
);
};