@cloudtower/eagle 4100.0.18 → 4100.0.19

package/dist/cjs/core/LineChart/ThresholdIntersectionLayer.js

@@ -0,0 +1,144 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var React = require('react');
+var _ = require('lodash');
+var recharts = require('recharts');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var React__default = /*#__PURE__*/_interopDefault(React);
+var ___default = /*#__PURE__*/_interopDefault(_);
+
+const DEFAULT_THRESHOLD_LINE_STROKE = "#ff4d4f";
+const DEFAULT_THRESHOLD_INTERSECTION_LABEL_TEXT_COLOR = "#ffffff";
+const THRESHOLD_INTERSECTION_LABEL_HEIGHT = 28;
+const THRESHOLD_INTERSECTION_LABEL_RADIUS = 4;
+const THRESHOLD_INTERSECTION_LABEL_OFFSET = 8;
+const THRESHOLD_INTERSECTION_LABEL_PADDING_X = 12;
+const THRESHOLD_INTERSECTION_LABEL_MIN_WIDTH = 48;
+const THRESHOLD_INTERSECTION_LABEL_FONT_SIZE = 12;
+const THRESHOLD_INTERSECTION_CJK_REGEXP = /[\u3400-\u9fff\uf900-\ufaff]/;
+const isThresholdIntersectionLabelVisible = (labelProps, info) => {
+  if (!labelProps) {
+    return false;
+  }
+  const { visible = true } = labelProps;
+  if (___default.default.isFunction(visible)) {
+    return visible(info);
+  }
+  return visible;
+};
+const getThresholdIntersectionLabelText = (labelProps, info) => {
+  const text = labelProps == null ? void 0 : labelProps.text;
+  if (___default.default.isFunction(text)) {
+    return text(info) || info.formattedThresholdValue;
+  }
+  return text || info.formattedThresholdValue;
+};
+const getThresholdIntersectionLabelWidth = (label) => {
+  const contentWidth = Array.from(label).reduce((sum, char) => {
+    return sum + (THRESHOLD_INTERSECTION_CJK_REGEXP.test(char) ? THRESHOLD_INTERSECTION_LABEL_FONT_SIZE : THRESHOLD_INTERSECTION_LABEL_FONT_SIZE * 0.65);
+  }, 0);
+  return Math.max(
+    THRESHOLD_INTERSECTION_LABEL_MIN_WIDTH,
+    Math.ceil(contentWidth) + THRESHOLD_INTERSECTION_LABEL_PADDING_X * 2
+  );
+};
+const ThresholdIntersectionLayer = ({
+  intersection,
+  index,
+  hovering,
+  intersectionLabelProps,
+  thresholdStroke,
+  onMouseEnter,
+  onMouseLeave,
+  xAxisMap,
+  yAxisMap
+}) => {
+  const xAxis = xAxisMap == null ? void 0 : xAxisMap[0];
+  const yAxis = yAxisMap == null ? void 0 : yAxisMap[0];
+  if (typeof (xAxis == null ? void 0 : xAxis.scale) !== "function" || typeof (yAxis == null ? void 0 : yAxis.scale) !== "function") {
+    return null;
+  }
+  return /* @__PURE__ */ React__default.default.createElement(
+    recharts.ReferenceDot,
+    {
+      xAxis,
+      yAxis,
+      x: intersection.timestamp,
+      y: intersection.value,
+      isFront: true,
+      shape: (shapeProps) => {
+        const { cx = 0, cy = 0 } = shapeProps;
+        const intersectionOpacity = hovering.includes(intersection.legend.id) ? 0.3 : 1;
+        const showIntersectionLabel = isThresholdIntersectionLabelVisible(
+          intersectionLabelProps,
+          intersection
+        );
+        const intersectionLabelText = showIntersectionLabel ? getThresholdIntersectionLabelText(
+          intersectionLabelProps,
+          intersection
+        ) : "";
+        const intersectionLabelColor = (intersectionLabelProps == null ? void 0 : intersectionLabelProps.color) || thresholdStroke || DEFAULT_THRESHOLD_LINE_STROKE;
+        const intersectionLabelTextColor = (intersectionLabelProps == null ? void 0 : intersectionLabelProps.textColor) || DEFAULT_THRESHOLD_INTERSECTION_LABEL_TEXT_COLOR;
+        const intersectionLabelWidth = getThresholdIntersectionLabelWidth(
+          intersectionLabelText
+        );
+        const intersectionLabelX = cx - intersectionLabelWidth / 2;
+        const intersectionLabelY = cy - THRESHOLD_INTERSECTION_LABEL_HEIGHT - THRESHOLD_INTERSECTION_LABEL_OFFSET;
+        return /* @__PURE__ */ React__default.default.createElement(
+          "g",
+          {
+            "data-testid": "line-chart-threshold-intersection-dot",
+            "data-intersection-id": `${intersection.legend.id}-${index}`,
+            onMouseEnter: () => onMouseEnter(intersection, cx, cy),
+            onMouseLeave
+          },
+          /* @__PURE__ */ React__default.default.createElement(
+            "circle",
+            {
+              cx,
+              cy,
+              r: 8,
+              fill: "transparent",
+              stroke: "transparent"
+            }
+          ),
+          showIntersectionLabel && /* @__PURE__ */ React__default.default.createElement("g", { "data-testid": "line-chart-threshold-intersection-label" }, /* @__PURE__ */ React__default.default.createElement(
+            "rect",
+            {
+              "data-testid": "line-chart-threshold-intersection-label-background",
+              x: intersectionLabelX,
+              y: intersectionLabelY,
+              width: intersectionLabelWidth,
+              height: THRESHOLD_INTERSECTION_LABEL_HEIGHT,
+              rx: THRESHOLD_INTERSECTION_LABEL_RADIUS,
+              ry: THRESHOLD_INTERSECTION_LABEL_RADIUS,
+              fill: intersectionLabelColor,
+              opacity: intersectionOpacity
+            }
+          ), /* @__PURE__ */ React__default.default.createElement(
+            "text",
+            {
+              x: cx,
+              y: intersectionLabelY + THRESHOLD_INTERSECTION_LABEL_HEIGHT / 2,
+              fill: intersectionLabelTextColor,
+              fontSize: THRESHOLD_INTERSECTION_LABEL_FONT_SIZE,
+              fontWeight: 500,
+              textAnchor: "middle",
+              dominantBaseline: "middle",
+              opacity: intersectionOpacity
+            },
+            intersectionLabelText
+          ))
+        );
+      }
+    }
+  );
+};
+var ThresholdIntersectionLayer$1 = ThresholdIntersectionLayer;
+
+exports.default = ThresholdIntersectionLayer$1;
+exports.isThresholdIntersectionLabelVisible = isThresholdIntersectionLabelVisible;

package/dist/cjs/core/LineChart/TooltipFormatter.js

@@ -1,8 +1,11 @@
 'use strict';
 
+Object.defineProperty(exports, '__esModule', { value: true });
+
 var react = require('@linaria/react');
 var LineChartLegend = require('./LineChartLegend.js');
 var styled = require('./styled.js');
+var utils = require('./utils.js');
 var dayjs = require('dayjs');
 var React = require('react');
 var index = require('../Typo/index.js');
@@ -12,32 +15,30 @@ function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 var dayjs__default = /*#__PURE__*/_interopDefault(dayjs);
 var React__default = /*#__PURE__*/_interopDefault(React);
 
-var __defProp = Object.defineProperty;
-var __defProps = Object.defineProperties;
-var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
-var __getOwnPropSymbols = Object.getOwnPropertySymbols;
-var __hasOwnProp = Object.prototype.hasOwnProperty;
-var __propIsEnum = Object.prototype.propertyIsEnumerable;
-var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, {
-  enumerable: true,
-  configurable: true,
-  writable: true,
-  value
-}) : obj[key] = value;
-var __spreadValues = (a, b) => {
-  for (var prop in b || (b = {})) if (__hasOwnProp.call(b, prop)) __defNormalProp(a, prop, b[prop]);
-  if (__getOwnPropSymbols) for (var prop of __getOwnPropSymbols(b)) {
-    if (__propIsEnum.call(b, prop)) __defNormalProp(a, prop, b[prop]);
-  }
-  return a;
-};
-var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
 const TooltipTitle = /*#__PURE__*/react.styled('div')({
   name: "TooltipTitle",
-  class: "E_4100_0_18_t1616y1o",
+  class: "E_4100_0_19_t1616y1o",
   propsAsIs: false
 });
+const LineChartTooltipContent = ({
+  title,
+  items
+}) => {
+  return /* @__PURE__ */React__default.default.createElement(styled.TooltipWrapper, null, /* @__PURE__ */React__default.default.createElement(TooltipTitle, {
+    className: index.Typo.Label.l4_bold_title
+  }, title), items.map(item => {
+    return /* @__PURE__ */React__default.default.createElement(styled.TooltipColumn, {
+      key: item.id
+    }, /* @__PURE__ */React__default.default.createElement("div", null, /* @__PURE__ */React__default.default.createElement(LineChartLegend.LineChartColorBlock, {
+      background: item.color,
+      borderd: true
+    }), item.label), /* @__PURE__ */React__default.default.createElement("div", {
+      className: "column-value"
+    }, item.value));
+  }));
+};
 const TooltipFormatter = props => {
+  var _a, _b;
   const {
     active,
     payload,
@@ -48,24 +49,28 @@ const TooltipFormatter = props => {
   if (!active || !(payload == null ? void 0 : payload.length)) {
     return null;
   }
-  return /* @__PURE__ */React__default.default.createElement(styled.TooltipWrapper, null, /* @__PURE__ */React__default.default.createElement(TooltipTitle, {
-    className: index.Typo.Label.l4_bold_title
-  }, dayjs__default.default(Number(payload[0].payload.t)).format("MM/DD HH:mm:ss")), payload.map(item => {
-    return __spreadProps(__spreadValues({}, item), {
-      legend: legends.find((_legend, index) => `v${index}` === item.name)
-    });
-  }).sort((a, b) => b.value - a.value).map(item => {
-    var _a, _b, _c, _d;
-    return deselected.includes(((_a = item.legend) == null ? void 0 : _a.id) || "") ? null : /* @__PURE__ */React__default.default.createElement(styled.TooltipColumn, {
-      key: (_b = item.legend) == null ? void 0 : _b.id
-    }, /* @__PURE__ */React__default.default.createElement("div", null, /* @__PURE__ */React__default.default.createElement(LineChartLegend.LineChartColorBlock, {
-      background: (_c = item.legend) == null ? void 0 : _c.color,
-      borderd: true
-    }), (_d = item.legend) == null ? void 0 : _d.name), /* @__PURE__ */React__default.default.createElement("div", {
-      className: "column-value"
-    }, format(item)));
-  }));
+  const metricPayloads = utils.getLineChartMetricPayloadMatches(payload, legends);
+  const titlePayload = (_b = (_a = metricPayloads[0]) == null ? void 0 : _a.payload) == null ? void 0 : _b.payload;
+  if (!titlePayload) {
+    return null;
+  }
+  const items = metricPayloads.sort((a, b) => b.payload.value - a.payload.value).flatMap(item => {
+    if (deselected.includes(item.legend.id)) {
+      return [];
+    }
+    return [{
+      id: item.legend.id,
+      color: item.legend.color,
+      label: item.legend.name,
+      value: format(item.payload)
+    }];
+  });
+  return /* @__PURE__ */React__default.default.createElement(LineChartTooltipContent, {
+    title: dayjs__default.default(Number(titlePayload.t)).format("MM/DD HH:mm:ss"),
+    items
+  });
 };
 var TooltipFormatter$1 = TooltipFormatter;
 
-module.exports = TooltipFormatter$1;
+exports.LineChartTooltipContent = LineChartTooltipContent;
+exports.default = TooltipFormatter$1;

package/dist/cjs/core/LineChart/areaHighlightUtils.js

@@ -0,0 +1,89 @@
+'use strict';
+
+const isFiniteNumber = (value) => typeof value === "number" && Number.isFinite(value);
+const getLineChartInterpolatedValue = (currentPoint, nextPoint, timestamp) => {
+  if (!isFiniteNumber(currentPoint.v) || !isFiniteNumber(nextPoint.v) || currentPoint.t === nextPoint.t) {
+    return void 0;
+  }
+  if (timestamp === currentPoint.t) {
+    return currentPoint.v;
+  }
+  if (timestamp === nextPoint.t) {
+    return nextPoint.v;
+  }
+  const ratio = (timestamp - currentPoint.t) / (nextPoint.t - currentPoint.t);
+  return currentPoint.v + (nextPoint.v - currentPoint.v) * ratio;
+};
+const isSameAreaHighlightPoint = (prev, next) => {
+  if (!prev) {
+    return false;
+  }
+  return Math.abs(prev.t - next.t) < 1e-6 && Math.abs(prev.value - next.value) < 1e-6;
+};
+const pushLineChartAreaHighlightPoint = (points, next) => {
+  if (!isSameAreaHighlightPoint(points[points.length - 1], next)) {
+    points.push(next);
+  }
+};
+const getLineChartAreaHighlightPointRuns = (points, range) => {
+  const runs = [];
+  let highlightedPoints = [];
+  const flushHighlightedPoints = () => {
+    if (highlightedPoints.length >= 2) {
+      runs.push(highlightedPoints);
+    }
+    highlightedPoints = [];
+  };
+  for (let index = 0; index < points.length - 1; index++) {
+    const currentPoint = points[index];
+    const nextPoint = points[index + 1];
+    if (!isFiniteNumber(currentPoint == null ? void 0 : currentPoint.t) || !isFiniteNumber(nextPoint == null ? void 0 : nextPoint.t) || !isFiniteNumber(currentPoint == null ? void 0 : currentPoint.v) || !isFiniteNumber(nextPoint == null ? void 0 : nextPoint.v) || currentPoint.t === nextPoint.t) {
+      flushHighlightedPoints();
+      continue;
+    }
+    if (nextPoint.t < range.start || currentPoint.t > range.end) {
+      continue;
+    }
+    const segmentStart = Math.max(range.start, currentPoint.t);
+    const segmentEnd = Math.min(range.end, nextPoint.t);
+    if (segmentStart >= segmentEnd) {
+      continue;
+    }
+    const startValue = getLineChartInterpolatedValue(
+      currentPoint,
+      nextPoint,
+      segmentStart
+    );
+    const endValue = getLineChartInterpolatedValue(
+      currentPoint,
+      nextPoint,
+      segmentEnd
+    );
+    if (!isFiniteNumber(startValue) || !isFiniteNumber(endValue)) {
+      flushHighlightedPoints();
+      continue;
+    }
+    const startPoint = {
+      t: segmentStart,
+      value: startValue
+    };
+    const endPoint = {
+      t: segmentEnd,
+      value: endValue
+    };
+    if (highlightedPoints.length && isSameAreaHighlightPoint(
+      highlightedPoints[highlightedPoints.length - 1],
+      startPoint
+    )) {
+      pushLineChartAreaHighlightPoint(highlightedPoints, endPoint);
+    } else {
+      flushHighlightedPoints();
+      highlightedPoints = [startPoint, endPoint];
+    }
+  }
+  flushHighlightedPoints();
+  return runs;
+};
+const getLineChartAreaHighlightRuns = (points, range) => getLineChartAreaHighlightPointRuns(points, range);
+
+exports.getLineChartAreaHighlightRuns = getLineChartAreaHighlightRuns;

package/dist/cjs/core/LineChart/index.js

@@ -7,6 +7,7 @@ var index = require('../ErrorBoundary/index.js');
 var Pointer = require('./Pointer.js');
 var RenderChart = require('./RenderChart.js');
 var styled = require('./styled.js');
+var useElementResize = require('../../hooks/useElementResize.js');
 var cs = require('classnames');
 var React = require('react');
 
@@ -46,15 +47,32 @@ const LineChart = React__default.default.forwardRef(
     } = props;
     const [width, setWidth] = React.useState(0);
     const wrapperRef = React.useRef(null);
-    React.useEffect(() => {
+    const syncWrapperWidth = React.useCallback(() => {
       var _a;
       setWidth(((_a = wrapperRef.current) == null ? void 0 : _a.offsetWidth) || 0);
     }, []);
+    const setWrapperNode = React.useCallback(
+      (node) => {
+        wrapperRef.current = node;
+        if (typeof ref === "function") {
+          ref(node);
+          return;
+        }
+        if (ref) {
+          ref.current = node;
+        }
+      },
+      [ref]
+    );
+    React.useEffect(() => {
+      syncWrapperWidth();
+    }, [syncWrapperWidth]);
+    useElementResize(wrapperRef, syncWrapperWidth, [showLegend, showXaxis, height]);
     return /* @__PURE__ */ React__default.default.createElement(index, { i18n: parrot.parrotI18n }, /* @__PURE__ */ React__default.default.createElement(
       styled.LineChartWrapper,
       {
         className: cs__default.default("metric-wrapper", !showXaxis && "hidden-xaxis"),
-        ref: wrapperRef,
+        ref: setWrapperNode,
         "data-testid": dataTestId,
         style: { height: showLegend ? height + 30 : height }
       },

package/dist/cjs/core/LineChart/lineChartDisplayUtils.js

@@ -0,0 +1,32 @@
+'use strict';
+
+const DEFAULT_LINE_CHART_STROKE = "#3182bd";
+const isFiniteNumber = (value) => typeof value === "number" && Number.isFinite(value);
+const isFiniteNumericYAxisDomain = (domain) => {
+  if (!Array.isArray(domain) || domain.length !== 2) {
+    return false;
+  }
+  return isFiniteNumber(domain[0]) && isFiniteNumber(domain[1]);
+};
+const getLineChartStreamStroke = (stream) => {
+  var _a;
+  const color = (_a = stream.legend.color) != null ? _a : DEFAULT_LINE_CHART_STROKE;
+  return stream.legend.stroke ? `${color}1A` : color;
+};
+const getLineChartDefaultYAxisTicks = (domain) => {
+  if (!isFiniteNumericYAxisDomain(domain)) {
+    return void 0;
+  }
+  const [, upper] = domain;
+  return [upper / 2, upper];
+};
+const getLineChartLegacyThresholdTooltipInfo = (info) => ({
+  current: info.formattedValue,
+  max: info.formattedThresholdValue
+});
+
+exports.DEFAULT_LINE_CHART_STROKE = DEFAULT_LINE_CHART_STROKE;
+exports.getLineChartDefaultYAxisTicks = getLineChartDefaultYAxisTicks;
+exports.getLineChartLegacyThresholdTooltipInfo = getLineChartLegacyThresholdTooltipInfo;
+exports.getLineChartStreamStroke = getLineChartStreamStroke;
+exports.isFiniteNumber = isFiniteNumber;

package/dist/cjs/core/LineChart/lineSegments.js

@@ -0,0 +1,90 @@
+'use strict';
+
+const isFiniteNumber = (value) => typeof value === "number" && Number.isFinite(value);
+const getLineChartLinePoint = (point) => {
+  if (!isFiniteNumber(point.t) || !isFiniteNumber(point.x) || !isFiniteNumber(point.y)) {
+    return void 0;
+  }
+  return {
+    t: point.t,
+    x: point.x,
+    y: point.y
+  };
+};
+const getLineChartBoundaryPoint = (previous, next, timestamp) => {
+  const duration = next.t - previous.t;
+  if (!duration) {
+    return void 0;
+  }
+  const ratio = (timestamp - previous.t) / duration;
+  return {
+    t: timestamp,
+    x: previous.x + (next.x - previous.x) * ratio,
+    y: previous.y + (next.y - previous.y) * ratio
+  };
+};
+const getLineChartLineSegments = (points, forecastStartTimestamp) => {
+  const segments = [];
+  const hasForecastStart = isFiniteNumber(forecastStartTimestamp);
+  let continuousPoints = [];
+  const flushContinuousPoints = () => {
+    if (continuousPoints.length < 2) {
+      continuousPoints = [];
+      return;
+    }
+    let segmentPoints = [continuousPoints[0]];
+    let dashed = Boolean(
+      hasForecastStart && continuousPoints[0].t >= forecastStartTimestamp
+    );
+    const pushSegment = () => {
+      if (segmentPoints.length >= 2) {
+        segments.push({ dashed, points: segmentPoints });
+      }
+    };
+    for (let index = 1; index < continuousPoints.length; index += 1) {
+      const previous = continuousPoints[index - 1];
+      const next = continuousPoints[index];
+      const nextDashed = Boolean(
+        hasForecastStart && next.t >= forecastStartTimestamp
+      );
+      if (hasForecastStart && nextDashed !== dashed) {
+        const boundaryPoint = getLineChartBoundaryPoint(
+          previous,
+          next,
+          forecastStartTimestamp
+        );
+        if (boundaryPoint) {
+          segmentPoints.push(boundaryPoint);
+          pushSegment();
+          segmentPoints = [boundaryPoint];
+          if (boundaryPoint.t !== next.t) {
+            segmentPoints.push(next);
+          }
+          dashed = nextDashed;
+          continue;
+        }
+      }
+      segmentPoints.push(next);
+    }
+    pushSegment();
+    continuousPoints = [];
+  };
+  points.forEach((point) => {
+    const linePoint = getLineChartLinePoint(point);
+    if (!linePoint) {
+      flushContinuousPoints();
+      return;
+    }
+    continuousPoints.push(linePoint);
+  });
+  flushContinuousPoints();
+  return segments;
+};
+const getLineChartLinePath = (points) => {
+  return points.map((point, index) => {
+    return `${index === 0 ? "M" : "L"}${point.x},${point.y}`;
+  }).join(" ");
+};
+
+exports.getLineChartLinePath = getLineChartLinePath;
+exports.getLineChartLineSegments = getLineChartLineSegments;

package/dist/cjs/core/LineChart/styled.js

@@ -2,28 +2,39 @@
 
 var react = require('@linaria/react');
 
-const MetricLegendTabStyle = "E_4100_0_18_mn7joto";
-const LegendStyle = "E_4100_0_18_l1bifhon";
-const LegendItemsStyle = "E_4100_0_18_ltthzck";
-const LegendItemsStyleDropdown = "E_4100_0_18_l1mumj7o";
-const ExtraResource = "E_4100_0_18_e45tc5l";
+const MetricLegendTabStyle = "E_4100_0_19_mn7joto";
+const LegendStyle = "E_4100_0_19_l1bifhon";
+const LegendItemsStyle = "E_4100_0_19_ltthzck";
+const LegendItemsStyleDropdown = "E_4100_0_19_l1mumj7o";
+const ExtraResource = "E_4100_0_19_e45tc5l";
 const LineChartWrapper = /*#__PURE__*/react.styled('div')({
   name: "LineChartWrapper",
-  class: "E_4100_0_18_lqeaosa",
+  class: "E_4100_0_19_lqeaosa",
+  propsAsIs: false
+});
+const ChartContentWrapper = /*#__PURE__*/react.styled('div')({
+  name: "ChartContentWrapper",
+  class: "E_4100_0_19_c2pr38p",
+  propsAsIs: false
+});
+const ThresholdTooltipOverlay = /*#__PURE__*/react.styled('div')({
+  name: "ThresholdTooltipOverlay",
+  class: "E_4100_0_19_tecdsj7",
   propsAsIs: false
 });
 const TooltipWrapper = /*#__PURE__*/react.styled('div')({
   name: "TooltipWrapper",
-  class: "E_4100_0_18_t2pr38p",
+  class: "E_4100_0_19_tjhvvia",
   propsAsIs: false
 });
 const TooltipColumn = /*#__PURE__*/react.styled('div')({
   name: "TooltipColumn",
-  class: "E_4100_0_18_tecdsj7",
+  class: "E_4100_0_19_tuyrup3",
   propsAsIs: false
 });
-const LineChartColorBlockStyle = "E_4100_0_18_ljhvvia";
+const LineChartColorBlockStyle = "E_4100_0_19_lheyn3m";
 
+exports.ChartContentWrapper = ChartContentWrapper;
 exports.ExtraResource = ExtraResource;
 exports.LegendItemsStyle = LegendItemsStyle;
 exports.LegendItemsStyleDropdown = LegendItemsStyleDropdown;
@@ -31,5 +42,6 @@ exports.LegendStyle = LegendStyle;
 exports.LineChartColorBlockStyle = LineChartColorBlockStyle;
 exports.LineChartWrapper = LineChartWrapper;
 exports.MetricLegendTabStyle = MetricLegendTabStyle;
+exports.ThresholdTooltipOverlay = ThresholdTooltipOverlay;
 exports.TooltipColumn = TooltipColumn;
 exports.TooltipWrapper = TooltipWrapper;