@cloudtower/eagle 0.0.0-no-uikit-1 → 0.0.0-theme-rc-1

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

@@ -0,0 +1,145 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var color = require('../../styles/token/color.js');
+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 = color.Color.text.neutral.ontint;
+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

@@ -0,0 +1,76 @@
+'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');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var dayjs__default = /*#__PURE__*/_interopDefault(dayjs);
+var React__default = /*#__PURE__*/_interopDefault(React);
+
+const TooltipTitle = /*#__PURE__*/react.styled('div')({
+  name: "TooltipTitle",
+  class: "E_0_0_0_theme_rc_1_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,
+    deselected,
+    legends,
+    format
+  } = props;
+  if (!active || !(payload == null ? void 0 : payload.length)) {
+    return null;
+  }
+  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;
+
+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

@@ -0,0 +1,86 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var parrot = require('@cloudtower/parrot');
+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');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var cs__default = /*#__PURE__*/_interopDefault(cs);
+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 LineChart = React__default.default.forwardRef(
+  (props, ref) => {
+    const {
+      "data-testid": dataTestId,
+      height = 154,
+      showPointer = true,
+      showLegend = true,
+      showXaxis = false,
+      chartProps
+    } = props;
+    const [width, setWidth] = React.useState(0);
+    const wrapperRef = React.useRef(null);
+    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: setWrapperNode,
+        "data-testid": dataTestId,
+        style: { height: showLegend ? height + 30 : height }
+      },
+      /* @__PURE__ */ React__default.default.createElement(RenderChart, __spreadProps(__spreadValues({}, chartProps), { width })),
+      showPointer && /* @__PURE__ */ React__default.default.createElement(Pointer, { uuid: chartProps.syncId, metricWidth: width })
+    ));
+  }
+);
+var LineChart$1 = LineChart;
+
+exports.default = LineChart$1;

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

@@ -0,0 +1,47 @@
+'use strict';
+
+var react = require('@linaria/react');
+
+const MetricLegendTabStyle = "E_0_0_0_theme_rc_1_mn7joto";
+const LegendStyle = "E_0_0_0_theme_rc_1_l1bifhon";
+const LegendItemsStyle = "E_0_0_0_theme_rc_1_ltthzck";
+const LegendItemsStyleDropdown = "E_0_0_0_theme_rc_1_l1mumj7o";
+const ExtraResource = "E_0_0_0_theme_rc_1_e45tc5l";
+const LineChartWrapper = /*#__PURE__*/react.styled('div')({
+  name: "LineChartWrapper",
+  class: "E_0_0_0_theme_rc_1_lqeaosa",
+  propsAsIs: false
+});
+const ChartContentWrapper = /*#__PURE__*/react.styled('div')({
+  name: "ChartContentWrapper",
+  class: "E_0_0_0_theme_rc_1_c2pr38p",
+  propsAsIs: false
+});
+const ThresholdTooltipOverlay = /*#__PURE__*/react.styled('div')({
+  name: "ThresholdTooltipOverlay",
+  class: "E_0_0_0_theme_rc_1_tecdsj7",
+  propsAsIs: false
+});
+const TooltipWrapper = /*#__PURE__*/react.styled('div')({
+  name: "TooltipWrapper",
+  class: "E_0_0_0_theme_rc_1_tjhvvia",
+  propsAsIs: false
+});
+const TooltipColumn = /*#__PURE__*/react.styled('div')({
+  name: "TooltipColumn",
+  class: "E_0_0_0_theme_rc_1_tuyrup3",
+  propsAsIs: false
+});
+const LineChartColorBlockStyle = "E_0_0_0_theme_rc_1_lheyn3m";
+
+exports.ChartContentWrapper = ChartContentWrapper;
+exports.ExtraResource = ExtraResource;
+exports.LegendItemsStyle = LegendItemsStyle;
+exports.LegendItemsStyleDropdown = LegendItemsStyleDropdown;
+exports.LegendStyle = LegendStyle;
+exports.LineChartColorBlockStyle = LineChartColorBlockStyle;
+exports.LineChartWrapper = LineChartWrapper;
+exports.MetricLegendTabStyle = MetricLegendTabStyle;
+exports.ThresholdTooltipOverlay = ThresholdTooltipOverlay;
+exports.TooltipColumn = TooltipColumn;
+exports.TooltipWrapper = TooltipWrapper;

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

@@ -0,0 +1,30 @@
+'use strict';
+
+var ILineChartTimeUnit = /* @__PURE__ */ ((ILineChartTimeUnit2) => {
+  ILineChartTimeUnit2["Day"] = "DAY";
+  ILineChartTimeUnit2["Hour"] = "HOUR";
+  ILineChartTimeUnit2["Month"] = "MONTH";
+  return ILineChartTimeUnit2;
+})(ILineChartTimeUnit || {});
+var ILineChartMetricUnit = /* @__PURE__ */ ((ILineChartMetricUnit2) => {
+  ILineChartMetricUnit2["Count"] = "COUNT";
+  ILineChartMetricUnit2["DataRateBit"] = "DATA_RATE_BIT";
+  ILineChartMetricUnit2["DataRateByte"] = "DATA_RATE_BYTE";
+  ILineChartMetricUnit2["DataSize"] = "DATA_SIZE";
+  ILineChartMetricUnit2["Frequency"] = "FREQUENCY";
+  ILineChartMetricUnit2["Load"] = "LOAD";
+  ILineChartMetricUnit2["Percent"] = "PERCENT";
+  ILineChartMetricUnit2["Ratio"] = "RATIO";
+  ILineChartMetricUnit2["Temperature"] = "TEMPERATURE";
+  ILineChartMetricUnit2["Time"] = "TIME";
+  return ILineChartMetricUnit2;
+})(ILineChartMetricUnit || {});
+var ILineChartGraphType = /* @__PURE__ */ ((ILineChartGraphType2) => {
+  ILineChartGraphType2["Area"] = "AREA";
+  ILineChartGraphType2["Stack"] = "STACK";
+  return ILineChartGraphType2;
+})(ILineChartGraphType || {});
+
+exports.ILineChartGraphType = ILineChartGraphType;
+exports.ILineChartMetricUnit = ILineChartMetricUnit;
+exports.ILineChartTimeUnit = ILineChartTimeUnit;