'use strict';

Object.defineProperty(exports, "__esModule", {
  value: true
});

var _propTypes = require('prop-types');

var _propTypes2 = _interopRequireDefault(_propTypes);

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

var ToolTip = function ToolTip(props) {
  var visibility = 'hidden';
  var transform = '';
  var x = 0;

  var width = 150;
  var height = 70;
  var transformText = 'translate( 10 , 10)';
  var transformArrow = 'translate(' + (width / 2 - 15) + ', ' + height + ')';
  var transformLine = 'translate(' + (width / 2 - 15) + ', ' + height + ')';

  if (props.tooltip.display === true) {
    var position = props.tooltip.pos;
    x = position.x;
    visibility = 'visible';
    transform = 'translate(' + (x - width / 2 + 5) + ', ' + -1 * props.tooltip.height + ')';
  } else {
    visibility = 'hidden';
  }
  return _react2.default.createElement(
    'g',
    { transform: transform, pointerEvents: 'none' },
    _react2.default.createElement('polygon', {
      className: 'shadow',
      points: '10,0  30,0  20,10',
      transform: transformArrow,
      fill: '#ffffff',
      opacity: '1',
      strokeWidth: '2px',
      stroke: props.tooltip.color,
      visibility: visibility
    }),
    _react2.default.createElement('rect', {
      width: width,
      height: height,
      rx: '0',
      ry: '0',
      visibility: visibility,
      fill: '#ffffff',
      opacity: '1',
      strokeOpacity: '1',
      stroke: props.tooltip.color,
      strokeWidth: '2px'
    }),
    _react2.default.createElement('line', {
      visibility: visibility,
      x1: '13',
      y1: '0',
      x2: '27',
      y2: '0',
      opacity: '1',
      strokeOpacity: '1',
      stroke: 'white',
      strokeWidth: '3px',
      transform: transformLine
    }),
    _react2.default.createElement(
      'text',
      { visibility: visibility, transform: transformText },
      _react2.default.createElement(
        'tspan',
        {
          x: '0',
          y: '10',
          textAnchor: 'left',
          fontSize: '12px',
          fill: '#657d8e'
        },
        props.tooltip.title + ' (' + props.tooltip.data.value + ')'
      ),
      _react2.default.createElement(
        'tspan',
        {
          x: '0',
          y: '20',
          textAnchor: 'left',
          dy: '12px',
          fontSize: '12px',
          fill: '#657d8e'
        },
        props.tooltip.data.key
      )
    )
  );
};

ToolTip.propTypes = {
  tooltip: _propTypes2.default.object
};

exports.default = ToolTip;
//# sourceMappingURL=BarChartTooltip.js.map