@cloudtower/eagle 4100.0.17 → 4100.0.19

package/dist/esm/core/AccordionCard/index.js

@@ -7,7 +7,7 @@ import DropdownTransition from '../../coreX/DropdownTransition/index.js';
 
 const Card = /*#__PURE__*/styled('div')({
   name: "Card",
-  class: "E_4100_0_17_c18gxmrl",
+  class: "E_4100_0_19_c18gxmrl",
   propsAsIs: false
 });
 const CloseButton = props => {

package/dist/esm/core/Alert/alert.style.js

@@ -1,4 +1,4 @@
-const MessageWrapperStyle = "E_4100_0_17_meo40fy";
-const AlertStyle = "E_4100_0_17_a1ctixr3";
+const MessageWrapperStyle = "E_4100_0_19_meo40fy";
+const AlertStyle = "E_4100_0_19_a1ctixr3";
 
 export { AlertStyle, MessageWrapperStyle };

package/dist/esm/core/Antd5Tree/Antd5Tree.style.js

@@ -1,3 +1,3 @@
-const Antd5TreeStyle = "E_4100_0_17_a712xr9";
+const Antd5TreeStyle = "E_4100_0_19_a712xr9";
 
 export { Antd5TreeStyle };

package/dist/esm/core/Avatar/index.js

@@ -8,7 +8,7 @@ const _exp = /*#__PURE__*/() => ({
 }) => background;
 const AvatarWrapper = /*#__PURE__*/styled('span')({
   name: "AvatarWrapper",
-  class: "E_4100_0_17_a1b5xrg3",
+  class: "E_4100_0_19_a1b5xrg3",
   propsAsIs: false,
   vars: {
     "a1b5xrg3-0": [_exp()]

package/dist/esm/core/Banner/banner.style.js

@@ -1,6 +1,6 @@
-const BasicBanner = "E_4100_0_17_bpgac8u";
-const ErrorBanner = "E_4100_0_17_envn4g3";
-const InfoBanner = "E_4100_0_17_i12w18eu";
-const WarningBanner = "E_4100_0_17_wujsnt4";
+const BasicBanner = "E_4100_0_19_bpgac8u";
+const ErrorBanner = "E_4100_0_19_envn4g3";
+const InfoBanner = "E_4100_0_19_i12w18eu";
+const WarningBanner = "E_4100_0_19_wujsnt4";
 
 export { BasicBanner, ErrorBanner, InfoBanner, WarningBanner };

package/dist/esm/core/BasicCTError/BasicCTError.style.js

@@ -1,3 +1,3 @@
-const BasicCTErrorStyle = "E_4100_0_17_b1jaupqb";
+const BasicCTErrorStyle = "E_4100_0_19_b1jaupqb";
 
 export { BasicCTErrorStyle };

package/dist/esm/core/BlankState/style.js

@@ -1,3 +1,3 @@
-const BlankStateWrapper = "E_4100_0_17_b1lj76ty";
+const BlankStateWrapper = "E_4100_0_19_b1lj76ty";
 
 export { BlankStateWrapper };

package/dist/esm/core/Breadcrumb/index.js

@@ -4,7 +4,7 @@ import React__default from 'react';
 
 const BreadWrapper = /*#__PURE__*/styled('div')({
   name: "BreadWrapper",
-  class: "E_4100_0_17_berrcjl",
+  class: "E_4100_0_19_berrcjl",
   propsAsIs: false
 });
 const Breadcrumb = props => {

package/dist/esm/core/Button/index.js

@@ -29,7 +29,7 @@ var __objRest = (source, exclude) => {
   }
   return target;
 };
-const ButtonStyle = "E_4100_0_17_b1wx3t3t";
+const ButtonStyle = "E_4100_0_19_b1wx3t3t";
 const isAntdButtonTypes = type => {
   return Boolean(type && ["default", "primary", "ghost", "dashed", "link", "text"].includes(type));
 };

package/dist/esm/core/ButtonGroup/index.js

@@ -29,10 +29,10 @@ var __objRest = (source, exclude) => {
   }
   return target;
 };
-const ButtonStyle = "E_4100_0_17_b1nip9bk";
+const ButtonStyle = "E_4100_0_19_b1nip9bk";
 const ButtonGroupContainer = /*#__PURE__*/styled('div')({
   name: "ButtonGroupContainer",
-  class: "E_4100_0_17_bqamoqe",
+  class: "E_4100_0_19_bqamoqe",
   propsAsIs: false
 });
 const ButtonGroup = React__default.forwardRef((props, ref) => {

package/dist/esm/core/Card/CardBody.js

@@ -2,7 +2,7 @@ import { styled } from '@linaria/react';
 
 const CardBody = /*#__PURE__*/styled('div')({
   name: "CardBody",
-  class: "E_4100_0_17_c1yd35n",
+  class: "E_4100_0_19_c1yd35n",
   propsAsIs: false
 });
 var CardBody$1 = CardBody;

package/dist/esm/core/Card/CardTitle.js

@@ -2,7 +2,7 @@ import { styled } from '@linaria/react';
 
 const CardTitle = /*#__PURE__*/styled('div')({
   name: "CardTitle",
-  class: "E_4100_0_17_c1kghdax",
+  class: "E_4100_0_19_c1kghdax",
   propsAsIs: false
 });
 var CardTitle$1 = CardTitle;

package/dist/esm/core/Card/CardWrapper.js

@@ -27,7 +27,7 @@ var __objRest = (source, exclude) => {
   }
   return target;
 };
-const boxShadow = "E_4100_0_17_b14q2gmw";
+const boxShadow = "E_4100_0_19_b14q2gmw";
 const Wrapper = forwardRef(props => {
   const _a = props,
     {
@@ -45,7 +45,7 @@ const Wrapper = forwardRef(props => {
 const _exp = /*#__PURE__*/() => Wrapper;
 const CardWrapper = /*#__PURE__*/styled(_exp())({
   name: "CardWrapper",
-  class: "E_4100_0_17_c1eym6el",
+  class: "E_4100_0_19_c1eym6el",
   propsAsIs: true
 });
 var CardWrapper$1 = CardWrapper;

package/dist/esm/core/Cascader/cascader.style.js

@@ -1,13 +1,13 @@
-const Hide = "E_4100_0_17_hrhfj7c";
-const DoubleRowOptionStyleWrapper = "E_4100_0_17_dt9qoak";
-const CascaderDefaultOptionLabel = "E_4100_0_17_crhnxq5";
-const CascaderNotData = "E_4100_0_17_c1iq43vd";
-const CascaderDefaultHeaderSearch = "E_4100_0_17_c1h2v0a8";
-const CascaderInputStyle = "E_4100_0_17_cgzzd7y";
-const CascaderDefaultHeaderContainer = "E_4100_0_17_c1ec3mnt";
-const CascaderDefaultHeader = "E_4100_0_17_c1iye0zj";
-const CascaderDropdown = "E_4100_0_17_ckhyuyx";
-const CascaderSmallDropdown = "E_4100_0_17_c1fmq9lv";
-const CascaderLargeDropdown = "E_4100_0_17_c1evusvc";
+const Hide = "E_4100_0_19_hrhfj7c";
+const DoubleRowOptionStyleWrapper = "E_4100_0_19_dt9qoak";
+const CascaderDefaultOptionLabel = "E_4100_0_19_crhnxq5";
+const CascaderNotData = "E_4100_0_19_c1iq43vd";
+const CascaderDefaultHeaderSearch = "E_4100_0_19_c1h2v0a8";
+const CascaderInputStyle = "E_4100_0_19_cgzzd7y";
+const CascaderDefaultHeaderContainer = "E_4100_0_19_c1ec3mnt";
+const CascaderDefaultHeader = "E_4100_0_19_c1iye0zj";
+const CascaderDropdown = "E_4100_0_19_ckhyuyx";
+const CascaderSmallDropdown = "E_4100_0_19_c1fmq9lv";
+const CascaderLargeDropdown = "E_4100_0_19_c1evusvc";
 
 export { CascaderDefaultHeader, CascaderDefaultHeaderContainer, CascaderDefaultHeaderSearch, CascaderDefaultOptionLabel, CascaderDropdown, CascaderInputStyle, CascaderLargeDropdown, CascaderNotData, CascaderSmallDropdown, DoubleRowOptionStyleWrapper, Hide };

package/dist/esm/core/Checkbox/checkbox.style.js

@@ -1,3 +1,3 @@
-const CheckboxStyle = "E_4100_0_17_ckui4s7";
+const CheckboxStyle = "E_4100_0_19_ckui4s7";
 
 export { CheckboxStyle };

package/dist/esm/core/DetailCard/index.js

@@ -3,7 +3,7 @@ import React__default from 'react';
 
 const CardWrapper = /*#__PURE__*/styled('div')({
   name: "CardWrapper",
-  class: "E_4100_0_17_c1uzzomf",
+  class: "E_4100_0_19_c1uzzomf",
   propsAsIs: false
 });
 const DetailCard = props => {

package/dist/esm/core/DonutChart/index.js

@@ -19,13 +19,13 @@ var DonutChartColor = /* @__PURE__ */(DonutChartColor2 => {
 const _exp = /*#__PURE__*/() => props => `${props.width}`;
 const DonutChartWrapper = /*#__PURE__*/styled('div')({
   name: "DonutChartWrapper",
-  class: "E_4100_0_17_d1bw7c5z",
+  class: "E_4100_0_19_d1bw7c5z",
   propsAsIs: false,
   vars: {
     "d1bw7c5z-0": [_exp(), "px"]
   }
 });
-const TooltipDefaultClass = "E_4100_0_17_t10pqbtc";
+const TooltipDefaultClass = "E_4100_0_19_t10pqbtc";
 const ColorMap = {
   ["blue" /* BLUE */]: [Color.chart.blue["blue-9"], Color.chart.blue["blue-7"], Color.chart.blue["blue-5"], Color.chart.blue["blue-3"], Color.chart.blue["blue-1"]],
   ["green" /* GREEN */]: [Color.chart.green["green-9"], Color.chart.green["green-7"], Color.chart.green["green-5"], Color.chart.green["green-3"], Color.chart.green["green-1"]],

package/dist/esm/core/DropdownMenu/index.js

@@ -3,7 +3,7 @@ import Tooltip from '../Tooltip/index.js';
 import { Menu, Dropdown } from 'antd';
 import React__default from 'react';
 
-const DropdownOverlayStyle = "E_4100_0_17_d133fzv0";
+const DropdownOverlayStyle = "E_4100_0_19_d133fzv0";
 const RenderMenuItem = item => {
   if (item.hidden === true) {
     return /* @__PURE__ */React__default.createElement(React__default.Fragment, null);

package/dist/esm/core/ExpandableList/ExpandIcon.js

@@ -1,7 +1,7 @@
 import { ArrowChevronUp16SecondaryIcon, ArrowChevronDown16SecondaryIcon } from '@cloudtower/icons-react';
 import React__default from 'react';
 
-const Style = "E_4100_0_17_suhck3k";
+const Style = "E_4100_0_19_suhck3k";
 const ExpandIcon = props => {
   const {
     isActive

package/dist/esm/core/ExpandableList/ExpandableContainer.js

@@ -1,7 +1,7 @@
 import { Card } from 'antd';
 import React__default from 'react';
 
-const card = "E_4100_0_17_c1yyuluq";
+const card = "E_4100_0_19_c1yyuluq";
 const ExpandableContainer = props => {
   const {
     children

package/dist/esm/core/ExpandableList/ExpandableItem.js

@@ -4,8 +4,8 @@ import { Collapse } from 'antd';
 import cs from 'classnames';
 import React__default, { useMemo, useState } from 'react';
 
-const CollapseStyle = "E_4100_0_17_ccrbeuz";
-const CollapseDisabled = "E_4100_0_17_c1fljvag";
+const CollapseStyle = "E_4100_0_19_ccrbeuz";
+const CollapseDisabled = "E_4100_0_19_c1fljvag";
 const ExpandableItem = props => {
   const {
     children,

package/dist/esm/core/ExpandableList/RoundOrder.js

@@ -1,7 +1,7 @@
 import { Typo } from '../Typo/index.js';
 import React__default from 'react';
 
-const RoundedOrderStyle = "E_4100_0_17_ryby9ds";
+const RoundedOrderStyle = "E_4100_0_19_ryby9ds";
 const RoundedOrder = props => {
   const {
     children,

package/dist/esm/core/FailedLoad/index.js

@@ -3,7 +3,7 @@ import useParrotTranslation from '../../hooks/useParrotTranslation.js';
 import cs from 'classnames';
 import React__default from 'react';
 
-const FailedLoadStyle = "E_4100_0_17_fzh9mnb";
+const FailedLoadStyle = "E_4100_0_19_fzh9mnb";
 const FailedLoad = props => {
   const {
     error,

package/dist/esm/core/FormItem/index.js

@@ -33,7 +33,7 @@ var __objRest = (source, exclude) => {
 const {
   Item: AntdFormItem
 } = Form;
-const FormItemStyle = "E_4100_0_17_f7pxqmh";
+const FormItemStyle = "E_4100_0_19_f7pxqmh";
 const FormItem = _a => {
   var _b = _a,
     {

package/dist/esm/core/Icon/index.js

@@ -31,7 +31,7 @@ var __objRest = (source, exclude) => {
   }
   return target;
 };
-const IconWrapper = "E_4100_0_17_iouxfgt";
+const IconWrapper = "E_4100_0_19_iouxfgt";
 const Icon = React__default.forwardRef((props, ref) => {
   const _a = props,
     {

package/dist/esm/core/ImmersiveDialog/styles.js

@@ -1,16 +1,16 @@
-const ImmersiveDialogStyle = "E_4100_0_17_icab5o7";
-const MultiAreaStyle = "E_4100_0_17_msiso3p";
-const CloseIconStyle = "E_4100_0_17_cxvrrew";
-const TitleStyle = "E_4100_0_17_tskzd0j";
-const FullContentStyle = "E_4100_0_17_f1fbnfp";
-const BodyStyle = "E_4100_0_17_b4g2nsx";
-const MultiAreaBodyStyle = "E_4100_0_17_myhed70";
-const FooterStyle = "E_4100_0_17_fo07jei";
-const FooterButtonStyle = "E_4100_0_17_fph3s12";
-const FooterButtonRightStyle = "E_4100_0_17_f1f8uj0i";
-const ErrorStyle = "E_4100_0_17_ejcjd85";
-const ErrorIconStyle = "E_4100_0_17_e1lj3r2s";
-const ErrorTextStyle = "E_4100_0_17_eb58k2y";
-const CancelButtonStyle = "E_4100_0_17_c1bad0d";
+const ImmersiveDialogStyle = "E_4100_0_19_icab5o7";
+const MultiAreaStyle = "E_4100_0_19_msiso3p";
+const CloseIconStyle = "E_4100_0_19_cxvrrew";
+const TitleStyle = "E_4100_0_19_tskzd0j";
+const FullContentStyle = "E_4100_0_19_f1fbnfp";
+const BodyStyle = "E_4100_0_19_b4g2nsx";
+const MultiAreaBodyStyle = "E_4100_0_19_myhed70";
+const FooterStyle = "E_4100_0_19_fo07jei";
+const FooterButtonStyle = "E_4100_0_19_fph3s12";
+const FooterButtonRightStyle = "E_4100_0_19_f1f8uj0i";
+const ErrorStyle = "E_4100_0_19_ejcjd85";
+const ErrorIconStyle = "E_4100_0_19_e1lj3r2s";
+const ErrorTextStyle = "E_4100_0_19_eb58k2y";
+const CancelButtonStyle = "E_4100_0_19_c1bad0d";
 
 export { BodyStyle, CancelButtonStyle, CloseIconStyle, ErrorIconStyle, ErrorStyle, ErrorTextStyle, FooterButtonRightStyle, FooterButtonStyle, FooterStyle, FullContentStyle, ImmersiveDialogStyle, MultiAreaBodyStyle, MultiAreaStyle, TitleStyle };

package/dist/esm/core/Input/index.js

@@ -36,7 +36,7 @@ var __objRest = (source, exclude) => {
 const _exp = /*#__PURE__*/() => Input$2;
 const StyledAntdInput = /*#__PURE__*/styled(_exp())({
   name: "StyledAntdInput",
-  class: "E_4100_0_17_sx1bpnu",
+  class: "E_4100_0_19_sx1bpnu",
   propsAsIs: true
 });
 const Input = _a => {

package/dist/esm/core/InputGroup/index.js

@@ -4,7 +4,7 @@ import { Input } from 'antd';
 const _exp = /*#__PURE__*/() => Input.Group;
 const InputGroup = /*#__PURE__*/styled(_exp())({
   name: "InputGroup",
-  class: "E_4100_0_17_itxley7",
+  class: "E_4100_0_19_itxley7",
   propsAsIs: true
 });
 var InputGroup$1 = InputGroup;

package/dist/esm/core/InputInteger/index.js

@@ -46,7 +46,7 @@ const _exp6 = /*#__PURE__*/() => ({
 }) => prefix ? "flex" : "none";
 const AntdIntStyled = /*#__PURE__*/styled(_exp())({
   name: "AntdIntStyled",
-  class: "E_4100_0_17_ai7qkf2",
+  class: "E_4100_0_19_ai7qkf2",
   propsAsIs: true,
   vars: {
     "ai7qkf2-0": [_exp2()],

package/dist/esm/core/InputNumber/index.js

@@ -45,7 +45,7 @@ const _exp6 = /*#__PURE__*/() => ({
 }) => prefix ? "flex" : "none";
 const AntdInputNumberStyled = /*#__PURE__*/styled(_exp())({
   name: "AntdInputNumberStyled",
-  class: "E_4100_0_17_a1wfy30z",
+  class: "E_4100_0_19_a1wfy30z",
   propsAsIs: true,
   vars: {
     "a1wfy30z-0": [_exp2()],

package/dist/esm/core/InputPassword/index.js

@@ -36,7 +36,7 @@ var __objRest = (source, exclude) => {
 const _exp = /*#__PURE__*/() => Input.Password;
 const AntdPasswordInputStyled = /*#__PURE__*/styled(_exp())({
   name: "AntdPasswordInputStyled",
-  class: "E_4100_0_17_atcz0kf",
+  class: "E_4100_0_19_atcz0kf",
   propsAsIs: true
 });
 const InputPassword = _a => {

package/dist/esm/core/InputTagItem/index.js

@@ -2,7 +2,7 @@ import { styled } from '@linaria/react';
 
 const InputTagItem = /*#__PURE__*/styled('span')({
   name: "InputTagItem",
-  class: "E_4100_0_17_i1inqkme",
+  class: "E_4100_0_19_i1inqkme",
   propsAsIs: false
 });
 var InputTagItem$1 = InputTagItem;

package/dist/esm/core/LegacySelect/select.style.js

@@ -1,3 +1,3 @@
-const SelectStyle = "E_4100_0_17_s17wv897";
+const SelectStyle = "E_4100_0_19_s17wv897";
 
 export { SelectStyle };

package/dist/esm/core/Legend/index.js

@@ -35,15 +35,15 @@ var __objRest = (source, exclude) => {
   return target;
 };
 const LegendPresetColors = ["blue", "red", "yellow", "green", "gray", "purple"];
-const LegendStyle = "E_4100_0_17_l1ucdodl";
+const LegendStyle = "E_4100_0_19_l1ucdodl";
 const StatusCodeCircle = /*#__PURE__*/styled('i')({
   name: "StatusCodeCircle",
-  class: "E_4100_0_17_s1qj66nc",
+  class: "E_4100_0_19_s1qj66nc",
   propsAsIs: false
 });
 const StatusCodeSquare = /*#__PURE__*/styled('i')({
   name: "StatusCodeSquare",
-  class: "E_4100_0_17_s5x1boq",
+  class: "E_4100_0_19_s5x1boq",
   propsAsIs: false
 });
 const LegendIcon = ({
@@ -88,7 +88,7 @@ const Legend = _a => {
     props = __objRest(_b, ["label", "color", "className", "hoverable", "children", "number", "shape", "onTintMode"]);
   const computedColor = ColorMap[color] || color;
   const content = /* @__PURE__ */React__default.createElement(React__default.Fragment, null, label || children, !!number && /* @__PURE__ */React__default.createElement("span", {
-    className: cs("E_4100_0_17_c1xm185", "ui-kit-status-legend-number", {
+    className: cs("E_4100_0_19_c1xm185", "ui-kit-status-legend-number", {
       "on-tint": onTintMode
     })
   }, number));
@@ -109,7 +109,7 @@ const Legend = _a => {
   }), /* @__PURE__ */React__default.createElement(OverflowTooltip, {
     content,
     tooltip: content,
-    className: "E_4100_0_17_c1x5l5qc"
+    className: "E_4100_0_19_c1x5l5qc"
   }));
 };
 var Legend$1 = Legend;

package/dist/esm/core/LineChart/AreaHighlightLayer.js

@@ -0,0 +1,115 @@
+import _ from 'lodash';
+import React__default, { useMemo } from 'react';
+
+const getAreaHighlightLinePath = (points) => {
+  if (!points.length) {
+    return "";
+  }
+  return points.map((point, index) => {
+    return `${index === 0 ? "M" : "L"}${point.x},${point.y}`;
+  }).join(" ");
+};
+const getAreaHighlightFillPath = (points, baseLineY) => {
+  if (!points.length) {
+    return "";
+  }
+  const linePath = getAreaHighlightLinePath(points);
+  const firstPoint = points[0];
+  const lastPoint = points[points.length - 1];
+  return `${linePath} L${lastPoint.x},${baseLineY} L${firstPoint.x},${baseLineY} Z`;
+};
+const AreaHighlightLayer = ({
+  forecastStartTimestamp,
+  overlay,
+  hovering,
+  offset,
+  xAxisMap,
+  yAxisMap
+}) => {
+  var _a, _b, _c, _d, _e, _f;
+  const clipPathId = useMemo(() => {
+    return _.uniqueId("line-chart-area-highlight-");
+  }, []);
+  const xScale = (_a = Object.values(xAxisMap || {})[0]) == null ? void 0 : _a.scale;
+  const yScale = (_b = Object.values(yAxisMap || {})[0]) == null ? void 0 : _b.scale;
+  const offsetLeft = (_c = offset == null ? void 0 : offset.left) != null ? _c : 0;
+  const offsetTop = (_d = offset == null ? void 0 : offset.top) != null ? _d : 0;
+  const offsetWidth = (_e = offset == null ? void 0 : offset.width) != null ? _e : 0;
+  const offsetHeight = (_f = offset == null ? void 0 : offset.height) != null ? _f : 0;
+  if (typeof xScale !== "function" || typeof yScale !== "function" || !offsetWidth || !offsetHeight) {
+    return null;
+  }
+  const projectedRuns = overlay.data.flatMap((run) => {
+    const runs = [];
+    let projectedPoints = [];
+    const flushProjectedPoints = () => {
+      if (projectedPoints.length >= 2) {
+        runs.push(projectedPoints);
+      }
+      projectedPoints = [];
+    };
+    run.forEach((point) => {
+      const projectedPoint = {
+        t: point.t,
+        x: xScale(point.t),
+        y: yScale(point.value)
+      };
+      if (Number.isFinite(projectedPoint.x) && Number.isFinite(projectedPoint.y)) {
+        projectedPoints.push(projectedPoint);
+      } else {
+        flushProjectedPoints();
+      }
+    });
+    flushProjectedPoints();
+    return runs;
+  });
+  if (!projectedRuns.length) {
+    return null;
+  }
+  const fallbackBaseLineY = offsetTop + offsetHeight;
+  const scaleBaseLineY = yScale(0);
+  const baseLineY = Number.isFinite(scaleBaseLineY) ? scaleBaseLineY : fallbackBaseLineY;
+  return /* @__PURE__ */ React__default.createElement(
+    "g",
+    {
+      className: "line-chart-area-highlight",
+      "data-testid": "line-chart-area-highlight",
+      style: { pointerEvents: "none" },
+      opacity: hovering.includes(overlay.legendId) ? 0.3 : 1
+    },
+    /* @__PURE__ */ React__default.createElement("defs", null, /* @__PURE__ */ React__default.createElement("clipPath", { id: clipPathId }, /* @__PURE__ */ React__default.createElement(
+      "rect",
+      {
+        x: offsetLeft,
+        y: offsetTop,
+        width: offsetWidth,
+        height: offsetHeight
+      }
+    ))),
+    /* @__PURE__ */ React__default.createElement("g", { clipPath: `url(#${clipPathId})` }, projectedRuns.map((projectedPoints, index) => {
+      const fillPath = getAreaHighlightFillPath(projectedPoints, baseLineY);
+      const linePath = getAreaHighlightLinePath(projectedPoints);
+      return /* @__PURE__ */ React__default.createElement("g", { key: `${overlay.key}-${index}` }, /* @__PURE__ */ React__default.createElement(
+        "path",
+        {
+          className: "line-chart-area-highlight-fill",
+          d: fillPath,
+          fill: overlay.fill,
+          fillOpacity: overlay.fillOpacity
+        }
+      ), !Number.isFinite(forecastStartTimestamp) && /* @__PURE__ */ React__default.createElement(
+        "path",
+        {
+          className: "line-chart-area-highlight-curve",
+          d: linePath,
+          fill: "none",
+          stroke: overlay.stroke,
+          strokeWidth: 1
+        }
+      ));
+    }))
+  );
+};
+var AreaHighlightLayer$1 = AreaHighlightLayer;
+
+export { AreaHighlightLayer$1 as default };

package/dist/esm/core/LineChart/ForecastLineLayer.js

@@ -0,0 +1,124 @@
+import { isFiniteNumber, getLineChartStreamStroke } from './lineChartDisplayUtils.js';
+import { getLineChartLineSegments, getLineChartLinePath } from './lineSegments.js';
+import _ from 'lodash';
+import React__default from 'react';
+
+const DEFAULT_FORECAST_LINE_STROKE_DASHARRAY = "4 4";
+const ForecastLineLayer = ({
+  forecastStartTimestamp,
+  stacked = false,
+  hovering,
+  streams,
+  deselected,
+  offset,
+  xAxisMap,
+  yAxisMap
+}) => {
+  var _a, _b, _c, _d, _e, _f;
+  const clipPathId = React__default.useMemo(() => {
+    return _.uniqueId("line-chart-forecast-");
+  }, []);
+  const xScale = (_a = Object.values(xAxisMap || {})[0]) == null ? void 0 : _a.scale;
+  const yScale = (_b = Object.values(yAxisMap || {})[0]) == null ? void 0 : _b.scale;
+  const offsetLeft = (_c = offset == null ? void 0 : offset.left) != null ? _c : 0;
+  const offsetTop = (_d = offset == null ? void 0 : offset.top) != null ? _d : 0;
+  const offsetWidth = (_e = offset == null ? void 0 : offset.width) != null ? _e : 0;
+  const offsetHeight = (_f = offset == null ? void 0 : offset.height) != null ? _f : 0;
+  const lines = React__default.useMemo(() => {
+    if (!Number.isFinite(forecastStartTimestamp) || typeof xScale !== "function" || typeof yScale !== "function" || !offsetWidth || !offsetHeight) {
+      return [];
+    }
+    const pointMaps = streams.map(
+      (stream) => new Map(stream.points.map((point) => [point.t, point]))
+    );
+    const timestamps = stacked ? Array.from(
+      new Set(
+        streams.flatMap(
+          (stream) => stream.points.map((point) => point.t).filter(isFiniteNumber)
+        )
+      )
+    ).sort((a, b) => a - b) : [];
+    return streams.flatMap((stream, streamIndex) => {
+      if (deselected.includes(stream.legend.id)) {
+        return [];
+      }
+      const points = stacked ? timestamps.map((timestamp) => {
+        const currentPoint = pointMaps[streamIndex].get(timestamp);
+        if (!isFiniteNumber(currentPoint == null ? void 0 : currentPoint.v)) {
+          return { t: timestamp, x: xScale(timestamp), y: void 0 };
+        }
+        const stackedValue = streams.reduce((sum, item, index) => {
+          var _a2;
+          if (index > streamIndex || deselected.includes(item.legend.id)) {
+            return sum;
+          }
+          const value = (_a2 = pointMaps[index].get(timestamp)) == null ? void 0 : _a2.v;
+          return sum + (isFiniteNumber(value) ? value : 0);
+        }, 0);
+        return {
+          t: timestamp,
+          x: xScale(timestamp),
+          y: yScale(stackedValue)
+        };
+      }) : stream.points.map((point) => ({
+        t: point.t,
+        x: isFiniteNumber(point.t) ? xScale(point.t) : void 0,
+        y: isFiniteNumber(point.v) ? yScale(point.v) : void 0
+      }));
+      const segments = getLineChartLineSegments(points, forecastStartTimestamp);
+      return segments.map((segment, segmentIndex) => ({
+        dashed: segment.dashed,
+        key: `${stream.legend.id}-${segmentIndex}-${segment.points[0].t}`,
+        legendId: stream.legend.id,
+        path: getLineChartLinePath(segment.points),
+        stroke: getLineChartStreamStroke(stream)
+      }));
+    });
+  }, [
+    forecastStartTimestamp,
+    offsetHeight,
+    offsetWidth,
+    deselected,
+    stacked,
+    streams,
+    xScale,
+    yScale
+  ]);
+  if (!lines.length || !offsetWidth || !offsetHeight) {
+    return null;
+  }
+  return /* @__PURE__ */ React__default.createElement(
+    "g",
+    {
+      className: "line-chart-forecast-lines",
+      "data-testid": "line-chart-forecast-lines",
+      style: { pointerEvents: "none" }
+    },
+    /* @__PURE__ */ React__default.createElement("defs", null, /* @__PURE__ */ React__default.createElement("clipPath", { id: clipPathId }, /* @__PURE__ */ React__default.createElement(
+      "rect",
+      {
+        x: offsetLeft,
+        y: offsetTop,
+        width: offsetWidth,
+        height: offsetHeight
+      }
+    ))),
+    /* @__PURE__ */ React__default.createElement("g", { clipPath: `url(#${clipPathId})` }, lines.map((line) => {
+      return /* @__PURE__ */ React__default.createElement(
+        "path",
+        {
+          key: line.key,
+          className: "line-chart-forecast-line",
+          d: line.path,
+          fill: "none",
+          opacity: hovering.includes(line.legendId) ? 0.3 : 1,
+          stroke: line.stroke,
+          strokeDasharray: line.dashed ? DEFAULT_FORECAST_LINE_STROKE_DASHARRAY : void 0
+        }
+      );
+    }))
+  );
+};
+var ForecastLineLayer$1 = ForecastLineLayer;
+
+export { DEFAULT_FORECAST_LINE_STROKE_DASHARRAY, ForecastLineLayer$1 as default };