code enhancements

src/data-table/data-cell.jsx

@@ -87,11 +87,9 @@ class DataCell extends React.PureComponent {
       general,
       measurement,
       styleBuilder,
-      styling,
-      qlik
+      styling
     } = this.props;
 
-    const inEditState = qlik.inEditState();
     const isColumnPercentageBased = measurement.name.substring(0, 1) === '%';
     let formattedMeasurementValue = formatMeasurementValue(measurement, styling);
     if (styleBuilder.hasComments()) {
@@ -138,7 +136,6 @@ class DataCell extends React.PureComponent {
         style={cellStyle}
       >
         <Tooltip
-          isTooltipActive={!inEditState}
           tooltipText={formattedMeasurementValue}
         >
           {formattedMeasurementValue}

src/main.less

@@ -18,6 +18,7 @@
     width: auto;
     opacity: .9;
     text-align: center;
+    transform: translate(-50%,-110%);
     >p{
       color: #fff;
     }

src/tooltip/index.jsx

@@ -1,5 +1,13 @@
 import React from 'react';
 import PropTypes from 'prop-types';
+
+const handleCalculateTooltipPosition = (event) => {
+  const tooltipClassName = 'tooltip-wrapper';
+  const tooltip = document.getElementsByClassName(tooltipClassName);
+
+  tooltip[0].style.left = event.clientX + 'px';
+  tooltip[0].style.top = event.clientY + 'px';
+};
 class Tooltip extends React.Component {
   constructor (props) {
     super(props);
@@ -7,7 +15,6 @@ class Tooltip extends React.Component {
       showTooltip: false
     };
     this.handleRenderTooltip = this.handleRenderTooltip.bind(this);
-    this.handleCalculateTooltipPosition = this.handleCalculateTooltipPosition.bind(this);
   }
 
   shouldComponentUpdate (nextProps, nextState) {
@@ -23,29 +30,20 @@ class Tooltip extends React.Component {
     this.setState({ showTooltip: !showTooltip });
   }
 
-  handleCalculateTooltipPosition (event) {
-    const tooltipClassName = 'tooltip-wrapper';
-    let tooltip = document.getElementsByClassName(tooltipClassName);
-    const xPositionOffset = 25;
-    const yPositionOffset = 65;
-
-    tooltip[0].style.left = event.clientX - xPositionOffset + 'px';
-    tooltip[0].style.top = event.clientY - yPositionOffset + 'px';
-  }
 
   render () {
-    const { children, tooltipText, isTooltipActive } = this.props;
+    const { children, tooltipText } = this.props;
     const { showTooltip } = this.state;
 
     return (
       <div
-        onMouseMove={this.handleCalculateTooltipPosition}
+        onMouseMove={handleCalculateTooltipPosition}
         onMouseOut={this.handleRenderTooltip}
         onMouseOver={this.handleRenderTooltip}
       >
         {children}
 
-        {showTooltip && isTooltipActive
+        {showTooltip
           ? (
             <div
               className="tooltip-wrapper"
@@ -62,7 +60,6 @@ class Tooltip extends React.Component {
 
 Tooltip.propTypes = {
   children: PropTypes.string.isRequired,
-  isTooltipActive: PropTypes.bool.isRequired,
   tooltipText: PropTypes.string.isRequired
 };
 export default Tooltip;