@alicloud/cloud-charts/lib/aop/component/FreeTooltip/index.js


"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports["default"] = Tooltip;
var _react = _interopRequireDefault(require("react"));
var _constants = require("../../../constants");
require("./index.css");
var Prefix = _constants.PrefixName + "-free-tooltip-";
function Tooltip(_ref) {
  var title = _ref.title,
    data = _ref.data;
  if (!title && (data === null || data === void 0 ? void 0 : data.length) === 0) {
    return /*#__PURE__*/_react["default"].createElement("div", null);
  }
  return /*#__PURE__*/_react["default"].createElement("div", {
    className: Prefix + "container"
  }, title && /*#__PURE__*/_react["default"].createElement("div", {
    className: Prefix + "title"
  }, title), /*#__PURE__*/_react["default"].createElement("div", {
    className: Prefix + "items-container"
  }, (data || []).map(function (item) {
    return /*#__PURE__*/_react["default"].createElement("div", {
      key: item.name,
      className: Prefix + "item"
    }, /*#__PURE__*/_react["default"].createElement("div", {
      className: Prefix + "name-container"
    }, item.color && /*#__PURE__*/_react["default"].createElement("div", {
      className: Prefix + "marker",
      style: {
        background: item.color
      }
    }), /*#__PURE__*/_react["default"].createElement("div", {
      className: Prefix + "name",
      style: {
        width: item.color ? 'calc(100% - 10px)' : '100%'
      }
    }, item.name)), /*#__PURE__*/_react["default"].createElement("div", {
      className: Prefix + "value"
    }, item.value));
  })));
}