@alicloud/cloud-charts
Version:

37 lines • 1.33 kB
JavaScript
import React from 'react';
import { PrefixName } from '../../../constants';
import "./index.css";
var Prefix = PrefixName + "-free-tooltip-";
export default 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.createElement("div", null);
}
return /*#__PURE__*/React.createElement("div", {
className: Prefix + "container"
}, title && /*#__PURE__*/React.createElement("div", {
className: Prefix + "title"
}, title), /*#__PURE__*/React.createElement("div", {
className: Prefix + "items-container"
}, (data || []).map(function (item) {
return /*#__PURE__*/React.createElement("div", {
key: item.name,
className: Prefix + "item"
}, /*#__PURE__*/React.createElement("div", {
className: Prefix + "name-container"
}, item.color && /*#__PURE__*/React.createElement("div", {
className: Prefix + "marker",
style: {
background: item.color
}
}), /*#__PURE__*/React.createElement("div", {
className: Prefix + "name",
style: {
width: item.color ? 'calc(100% - 10px)' : '100%'
}
}, item.name)), /*#__PURE__*/React.createElement("div", {
className: Prefix + "value"
}, item.value));
})));
}